Merge pull request #20 from Spythere/development

Wersja 1.8.1
bump: 1.8.1
2026-05-03 05:18:10 +00:00 · 2024-03-07 14:22:45 +01:00 · 2024-03-07 14:19:23 +01:00 · 2024-03-07 14:19:04 +01:00 · 2024-02-20 13:26:22 +01:00 · 2024-02-20 12:14:09 +01:00
49 changed files with 3868 additions and 7716 deletions
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
  <head>
    <meta charset="utf-8" />
@@ -8,23 +8,20 @@
    <title>Pojazdownik</title>
    <meta name="description" content="Edytor pociągów online do symulatora Train Driver 2" />

-    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
-    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
-    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
-    <link rel="manifest" href="/site.webmanifest" />
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon-180x180.png" />
    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
-    
+    <link rel="manifest" href="/site.webmanifest" />
+
    <meta name="msapplication-TileColor" content="#da532c" />
-    <meta name="theme-color" content="#e4c428" />
+    <meta name="theme-color" content="#111" />
  </head>
  <body>
    <noscript>
-      <strong>
-        We're sorry but Pojazdownik doesn't work properly without JavaScript enabled. Please enable it to continue.
-      </strong>
+      <strong> We're sorry but Pojazdownik doesn't work properly without JavaScript enabled. Please enable it to continue. </strong>
    </noscript>
    <div id="app"></div>
    <script type="module" src="/src/main.ts"></script>
  </body>
 </html>
-
@@ -1,7 +1,8 @@
 {
  "name": "pojazdownik",
-  "version": "1.7.0",
+  "version": "1.8.1",
  "private": true,
+  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc --noEmit && vite build",
@@ -19,16 +20,17 @@
  },
  "devDependencies": {
    "@rushstack/eslint-patch": "^1.3.3",
-    "@vitejs/plugin-vue": "^4.1.0",
-    "@vue/eslint-config-prettier": "^8.0.0",
+    "@vite-pwa/assets-generator": "^0.2.3",
+    "@vitejs/plugin-vue": "^5.0.3",
+    "@vue/eslint-config-prettier": "^9.0.0",
    "@vue/eslint-config-typescript": "^12.0.0",
-    "@vue/tsconfig": "^0.4.0",
+    "@vue/tsconfig": "^0.5.1",
    "eslint": "^8.49.0",
    "eslint-plugin-vue": "^9.17.0",
    "sass": "^1.59.3",
    "typescript": "^5.0.2",
-    "vite": "^4.2.1",
-    "vite-plugin-pwa": "^0.14.6",
+    "vite": "^5.0.12",
+    "vite-plugin-pwa": "^0.17.5",
    "vue-tsc": "^1.2.0"
  }
 }
@@ -0,0 +1,24 @@
+<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="path-1-inside-1_102_63" fill="white">
+<path d="M0 250C0 111.929 111.929 6.10352e-05 250 6.10352e-05C388.071 6.10352e-05 500 111.929 500 250C500 388.071 388.071 500 250 500C111.929 500 0 388.071 0 250Z"/>
+</mask>
+<path d="M0 250C0 111.929 111.929 6.10352e-05 250 6.10352e-05C388.071 6.10352e-05 500 111.929 500 250C500 388.071 388.071 500 250 500C111.929 500 0 388.071 0 250Z" fill="#242424"/>
+<path d="M0 222.821C0 84.7503 111.929 -27.1785 250 -27.1785C388.071 -27.1785 500 84.7503 500 222.821V250C500 126.939 388.071 27.1787 250 27.1787C111.929 27.1787 0 126.939 0 250V222.821ZM500 277.179C500 415.25 388.071 527.179 250 527.179C111.929 527.179 0 415.25 0 277.179V250C0 373.061 111.929 472.821 250 472.821C388.071 472.821 500 373.061 500 250V277.179ZM0 500V6.10352e-05V500ZM500 6.10352e-05V500V6.10352e-05Z" fill="#FFD600" mask="url(#path-1-inside-1_102_63)"/>
+<path d="M210.369 301.604C210.369 301.604 210.369 341.807 210.369 364.846C210.369 387.885 202.798 417.491 171.591 417.491C140.385 417.491 132.813 417.491 132.813 417.491L132.812 78.125L250.754 78.125C274.312 78.125 294.504 80.9665 311.331 86.6494C328.311 92.1788 342.232 99.8585 353.093 109.689C364.107 119.519 372.214 131.115 377.415 144.478C382.616 157.84 385.217 172.278 385.217 187.791C385.217 204.533 382.54 219.892 377.186 233.869C371.832 247.846 363.648 259.827 352.634 269.81C341.62 279.794 327.623 287.627 310.643 293.31C293.816 298.839 273.853 301.604 250.754 301.604L210.369 301.604ZM210.369 242.854L250.754 242.854C270.946 242.854 285.479 238.016 294.351 228.34C303.224 218.663 307.66 205.147 307.66 187.791C307.66 180.111 306.512 173.123 304.218 166.825C301.923 160.528 298.405 155.152 293.663 150.698C289.074 146.09 283.184 142.558 275.995 140.1C268.958 137.643 260.544 136.414 250.754 136.414L210.369 136.414L210.369 242.854Z" fill="url(#paint0_linear_102_63)"/>
+<path d="M239.215 301.604C239.215 301.604 239.215 341.807 239.215 364.846C239.215 387.885 231.643 417.491 200.437 417.491C169.231 417.491 161.659 417.491 161.659 417.491L161.658 78.125L279.6 78.125C303.158 78.125 323.35 80.9665 340.177 86.6494C357.157 92.1788 371.077 99.8585 381.938 109.689C392.952 119.519 401.06 131.115 406.261 144.478C411.462 157.84 414.062 172.278 414.062 187.791C414.062 204.533 411.385 219.892 406.031 233.869C400.677 247.846 392.493 259.827 381.479 269.81C370.465 279.794 356.468 287.627 339.488 293.31C322.662 298.839 302.699 301.604 279.6 301.604L239.215 301.604ZM239.215 242.854L279.6 242.854C299.792 242.854 314.325 238.016 323.197 228.34C332.069 218.663 336.505 205.147 336.505 187.791C336.505 180.111 335.358 173.123 333.064 166.825C330.769 160.528 327.251 155.152 322.509 150.698C317.919 146.09 312.03 142.558 304.84 140.1C297.804 137.643 289.39 136.414 279.6 136.414L239.215 136.414L239.215 242.854Z" fill="url(#paint1_linear_102_63)"/>
+<path d="M210.685 301.604C210.685 301.604 210.685 341.807 210.685 364.846C210.685 387.885 203.082 417.491 171.749 417.491C140.416 417.491 132.813 417.491 132.813 417.491L132.812 78.125L251.233 78.125C274.887 78.125 295.161 80.9665 312.057 86.6494C329.105 92.1788 343.083 99.8585 353.988 109.689C365.046 119.519 373.187 131.115 378.409 144.478C383.631 157.84 386.242 172.278 386.242 187.791C386.242 204.533 383.555 219.892 378.179 233.869C372.803 247.846 364.586 259.827 353.527 269.81C342.468 279.794 328.414 287.627 311.365 293.31C294.47 298.839 274.426 301.604 251.233 301.604L210.685 301.604ZM210.685 242.854L251.233 242.854C271.508 242.854 286.099 238.016 295.008 228.34C303.916 218.663 308.37 205.147 308.37 187.791C308.37 180.111 307.218 173.123 304.914 166.825C302.611 160.528 299.078 155.152 294.316 150.698C289.709 146.09 283.795 142.558 276.576 140.1C269.511 137.643 261.063 136.414 251.233 136.414L210.685 136.414L210.685 242.854Z" fill="url(#paint2_radial_102_63)"/>
+<defs>
+<linearGradient id="paint0_linear_102_63" x1="259.015" y1="78.125" x2="259.015" y2="417.491" gradientUnits="userSpaceOnUse">
+<stop offset="0.135417" stop-color="#FFD600"/>
+<stop offset="1"/>
+</linearGradient>
+<linearGradient id="paint1_linear_102_63" x1="287.86" y1="78.125" x2="287.86" y2="417.491" gradientUnits="userSpaceOnUse">
+<stop offset="0.135417" stop-color="#FFD600"/>
+<stop offset="1"/>
+</linearGradient>
+<radialGradient id="paint2_radial_102_63" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(259.527 247.808) rotate(0.36307) scale(345.948 325.206)">
+<stop offset="0.484375" stop-color="white"/>
+<stop offset="1"/>
+</radialGradient>
+</defs>
+</svg>
@@ -5,15 +5,26 @@
  "description": "Generator składów online dla symulatora Train Driver 2",
  "icons": [
    {
-      "src": "/android-chrome-192x192.png",
+      "src": "pwa-64x64.png",
+      "sizes": "64x64",
+      "type": "image/png"
+    },
+    {
+      "src": "pwa-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
-      "src": "/android-chrome-512x512.png",
+      "src": "pwa-512x512.png",
      "sizes": "512x512",
      "type": "image/png",
-      "purpose": "any maskable"
+      "purpose": "any"
+    },
+    {
+      "src": "maskable-icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
    }
  ],
  "theme_color": "#2c3149",
@@ -5,19 +5,29 @@
  "description": "Generator składów online dla symulatora Train Driver 2",
  "icons": [
    {
-      "src": "/android-chrome-192x192.png",
+      "src": "pwa-64x64.png",
+      "sizes": "64x64",
+      "type": "image/png"
+    },
+    {
+      "src": "pwa-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
-      "src": "/android-chrome-512x512.png",
+      "src": "pwa-512x512.png",
      "sizes": "512x512",
      "type": "image/png",
-      "purpose": "any maskable"
+      "purpose": "any"
+    },
+    {
+      "src": "maskable-icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
    }
  ],
  "theme_color": "#2c3149",
  "background_color": "#2c3149",
  "display": "standalone"
 }
-
@@ -5,11 +5,11 @@
 </template>

 <script lang="ts">
-import { defineComponent } from 'vue';
-import { useStore } from './store';
-import ImageFullscreenPreview from './components/utils/ImageFullscreenPreview.vue';
-import AppContainerView from './views/AppContainerView.vue';
-import AppModals from './components/app/AppModals.vue';
+import { defineComponent } from "vue";
+import { useStore } from "./store";
+import ImageFullscreenPreview from "./components/utils/ImageFullscreenPreview.vue";
+import AppContainerView from "./views/AppContainerView.vue";
+import AppModals from "./components/app/AppModals.vue";

 export default defineComponent({
  data() {
@@ -26,7 +26,7 @@ export default defineComponent({
 </script>

 <style lang="scss">
-@import './styles/global.scss';
+@import "./styles/global.scss";

 /* APP */
 #app {
@@ -34,24 +34,14 @@ export default defineComponent({

  color: $textColor;
  font-size: 1em;
-  padding: 1em 0.5em;
-}
+  padding: 0;

-/* HEADER SECTION */
+  @media screen and (max-width: $breakpointMd) {
+    font-size: calc(0.7rem + 0.75vw);
+  }

-h2 {
-  margin: 0;
-  margin-bottom: 0.5em;
-
-  color: $accentColor;
-  font-weight: 700;
-  font-size: 1.2em;
-}
-
-.header-bottom {
-  margin: 0;
-  font-size: 1.5em;
-
-  color: #d1d1d1;
+  @media screen and (orientation: landscape) and (max-width: $breakpointMd) {
+    font-size: calc(0.75rem + 0.4vw);
+  }
 }
 </style>
@@ -41,12 +41,7 @@ export default defineComponent({

 <style lang="scss" scoped>
 footer {
-  display: flex;
-  flex-direction: column;
-  gap: 0.25em;
-
  text-align: center;
  padding: 1em 1em 0 1em;
-  margin-top: auto;
 }
 </style>
@@ -27,11 +27,15 @@ main {
  gap: 1em;

  width: 100%;
-  max-width: 1300px;
-  min-height: 75vh;
+  max-width: 1350px;

  grid-template-columns: 1fr 2fr;
-  grid-template-rows: auto 360px minmax(400px, 1fr);
+  grid-template-rows: auto 360px minmax(300px, 1fr);
+
+  background-color: darken($color: $bgColor, $amount: 5);
+  border-radius: 1em;
+
+  padding: 1em;
 }

@media screen and (max-width: $breakpointMd) {
@@ -0,0 +1,58 @@
+<template>
+  <label>
+    <input type="checkbox" v-model="model" />
+    <div><slot /></div>
+  </label>
+</template>
+
+<script lang="ts" setup>
+const model = defineModel();
+</script>
+
+<style lang="scss" scoped>
+label {
+  cursor: pointer;
+
+  text-transform: uppercase;
+  transition: color 200ms;
+}
+
+div {
+  padding: 0.25em 0.5em;
+  color: white;
+
+  background-color: #222;
+  border-radius: 0.25em;
+
+  user-select: none;
+
+  &::before {
+    content: "\2716";
+    margin-right: 0.5em;
+    color: #aaa;
+  }
+}
+
+input {
+  position: absolute;
+  clip: rect(1px, 1px, 1px, 1px);
+  padding: 0;
+  border: 0;
+  height: 1px;
+  width: 1px;
+  overflow: hidden;
+
+  &:focus-visible + div {
+    outline: 1px solid white;
+  }
+
+  &:checked + div {
+    color: palegreen;
+
+    &::before {
+      color: palegreen;
+      content: "\2714";
+    }
+  }
+}
+</style>
@@ -80,7 +80,7 @@
          </option>
          <option :value="null" v-else>{{ $t('inputs.cargo-empty') }}</option>

-          <option v-for="cargo in store.chosenCar?.cargoList" :value="cargo" :key="cargo.id">
+          <option v-for="cargo in store.chosenCar?.cargoTypes" :value="cargo" :key="cargo.id">
            {{ cargo.id }}
          </option>
        </select>
@@ -216,7 +216,7 @@ export default defineComponent({

        this.store.chosenVehicle = type == 'loco' ? this.store.chosenLoco : this.store.chosenCar;

-        this.store.chosenCargo = this.store.chosenCar?.cargoList.find((cargo) => cargo.id == this.store.chosenCargo?.id) || null;
+        this.store.chosenCargo = this.store.chosenCar?.cargoTypes.find((cargo) => cargo.id == this.store.chosenCargo?.id) || null;
      });
    },
  },
@@ -16,10 +16,7 @@

    <transition name="tab-change" mode="out-in">
      <keep-alive>
-        <component
-          :is="chosenSectionComponent"
-          :key="chosenSectionComponent"
-        ></component>
+        <component :is="chosenSectionComponent"></component>
      </keep-alive>
    </transition>
  </section>
@@ -2,16 +2,13 @@
  <section class="train-image-section">
    <div class="train-image__content" :class="{ sponsor: store.chosenVehicle?.isSponsorsOnly }">
      <img
-        v-if="store.chosenVehicle"
        tabindex="0"
-        :src="getThumbnailURL(store.chosenVehicle.type, 'small')"
+        :src="store.chosenVehicle ? getThumbnailURL(store.chosenVehicle.type, 'small') : '/images/placeholder.jpg'"
        @click="onImageClick"
        @keydown.enter="onImageClick"
        @error="onImageError"
        type="image/jpeg"
      />
-
-      <img v-else src="/images/placeholder.jpg" alt="placeholder" />
    </div>

    <div class="train-image__info" v-if="store.chosenVehicle">
@@ -21,7 +18,7 @@
      </b>

      <div style="color: #ccc">
-        <div>{{ store.chosenVehicle.length }}m | {{ store.chosenVehicle.mass }}t | {{ store.chosenVehicle.maxSpeed }} km/h</div>
+        <div>{{ store.chosenVehicle.length }}m | {{ (store.chosenVehicle.weight / 1000).toFixed(1) }}t | {{ store.chosenVehicle.maxSpeed }} km/h</div>

        <div v-if="isLocomotive(store.chosenVehicle)">{{ $t('preview.cabin') }} {{ store.chosenVehicle.cabinType }}</div>

@@ -2,46 +2,70 @@
  <div class="number-generator tab">
    <div class="tab_header">
      <h2>{{ $t("numgen.title") }}</h2>
+      <h3>{{ $t("numgen.subtitle") }}</h3>
    </div>

    <div class="tab_content">
-      <div class="options">
-        <select v-model="chosenCategory" @change="randomizeTrainNumber()">
+      <div class="category-select">
+        <label for="category"> {{ $t("numgen.train-category") }}</label>
+        <select
+          id="category"
+          v-model="chosenCategory"
+          @change="randomizeTrainNumber()"
+        >
          <option :value="null" disabled>
            {{ $t("numgen.train-category") }}
          </option>
          <option
-            v-for="(_, category) in genData.categories"
+            v-for="(_, category) in genData.categoriesRules"
            :key="category"
            :value="category"
          >
            {{ $t(`numgen.categories.${category}`) }}
          </option>
        </select>
+      </div>

-        <select v-model="beginRegionName" @change="randomizeTrainNumber()">
-          <option :value="null" disabled>
-            {{ $t("numgen.start-region") }}
-          </option>
-          <option
-            v-for="(_, name) in genData.regionNumbers"
-            :key="name"
-            :value="name"
+      <div class="regions-select">
+        <div>
+          <label for="begin-region"> {{ $t("numgen.start-region") }}</label>
+          <select
+            id="begin-region"
+            v-model="beginRegionName"
+            @change="randomizeTrainNumber()"
          >
-            {{ name }}
-          </option>
-        </select>
+            <option :value="null" disabled>
+              {{ $t("numgen.start-region") }}
+            </option>
+            <option
+              v-for="(_, name) in genData.regionNumbers"
+              :key="name"
+              :value="name"
+            >
+              {{ name }}
+            </option>
+          </select>
+        </div>

-        <select v-model="endRegionName" @change="randomizeTrainNumber()">
-          <option :value="null" disabled>{{ $t("numgen.end-region") }}</option>
-          <option
-            v-for="(_, name) in genData.regionNumbers"
-            :key="name"
-            :value="name"
+        <div>
+          <label for="end-region"> {{ $t("numgen.end-region") }}</label>
+          <select
+            id="end-region"
+            v-model="endRegionName"
+            @change="randomizeTrainNumber()"
          >
-            {{ name }}
-          </option>
-        </select>
+            <option :value="null" disabled>
+              {{ $t("numgen.end-region") }}
+            </option>
+            <option
+              v-for="(_, name) in genData.regionNumbers"
+              :key="name"
+              :value="name"
+            >
+              {{ name }}
+            </option>
+          </select>
+        </div>
      </div>

      <div class="generated-number" @click="copyNumber">
@@ -52,22 +76,69 @@
        <span v-else>{{ $t("numgen.warning") }}</span>
      </div>

-      <!-- <div v-if="chosenCategory">
-        Current numbering rules: {{ $t(`numgen.rules.${chosenCategory}`) }};
+      <div
+        class="category-rules"
+        v-if="chosenCategory && categoryRules && trainNumber"
+      >
+        <!-- First & second digit (the same regions)  -->
+        <div
+          v-if="
+            beginRegionName && endRegionName && beginRegionName == endRegionName
+          "
+        >
+          <b>{{ $t("numgen.rules.two-first-digits") }}</b>
+          {{ $t("numgen.rules.from-pool") }}
+          <b class="text--accent">{{
+            genData.sameRegions[beginRegionName].join(", ")
+          }}</b>
+          {{ $t("numgen.rules.for-region") }} {{ beginRegionName }}
+        </div>

-        <span v-if="beginRegionName && endRegionName">
-          <span v-if="beginRegionName == endRegionName">
-            pierwsze dwie cyfry:
-            {{ genData.sameRegions[beginRegionName].join(', ') }}
-            (numer w obrębie obszaru {{ beginRegionName }})
-          </span>
+        <!-- First & second digit (different regions)  -->
+        <div v-else>
+          <div>
+            <b>
+              {{ $t("numgen.rules.first-digit") }}
+              <span class="text--accent">{{ trainNumber[0] }}</span>
+            </b>
+            {{ $t("numgen.rules.for-region-begin") }} {{ beginRegionName }}
+          </div>

-          <span v-else>
-            pierwsza cyfra: {{ genData.regionNumbers[beginRegionName] }}; druga cyfra:
-            {{ genData.regionNumbers[endRegionName] }}
-          </span>
-        </span>
-      </div> -->
+          <div>
+            <b>
+              {{ $t("numgen.rules.second-digit") }}
+              <span class="text--accent">{{ trainNumber[1] }} </span>
+            </b>
+            {{ $t("numgen.rules.for-region-end") }} {{ endRegionName }}
+          </div>
+        </div>
+
+        <!-- Third digit (non-passenger only) -->
+        <div v-if="categoryRules[0] != null">
+          <b>
+            {{ $t("numgen.rules.third-digit") }}
+            <span class="text--accent">{{ categoryRules[0] }}</span>
+          </b>
+          {{ $t("numgen.rules.for-category") }} {{ chosenCategory }}
+        </div>
+
+        <!-- Last digits  -->
+        <div>
+          <b>
+            {{
+              $t(
+                `numgen.rules.${categoryRules[1]?.length == 3 ? "three" : "two"}-last-digits`,
+              )
+            }}</b
+          >
+          {{ $t("numgen.rules.from-range") }}
+          <b class="text--accent"
+            >{{ categoryRules[1] }}-{{ categoryRules[2] }}</b
+          >
+        </div>
+      </div>
+
+      <hr />

      <div class="tab_links">
        <a :href="$t('numgen.td2-wiki-link')" target="_blank">
@@ -81,6 +152,11 @@
        <button class="btn" @click="randomizeTrainNumber(true)">
          {{ $t("numgen.action-random-region") }}
        </button>
+
+        <button class="btn" @click="randomizeCategory">
+          {{ $t("numgen.action-random-category") }}
+        </button>
+
        <button class="btn" @click="randomizeTrainNumber(false)">
          {{ $t("numgen.action-random-number") }}
        </button>
@@ -94,10 +170,11 @@ import { Ref, ref } from "vue";
 import { useI18n } from "vue-i18n";

 import genData from "../../constants/numberGeneratorData.json";
+import { computed } from "vue";

 const i18n = useI18n();
 type RegionName = keyof typeof genData.regionNumbers;
-type Category = keyof typeof genData.categories;
+type Category = keyof typeof genData.categoriesRules;

 const beginRegionName = ref(null) as Ref<RegionName | null>;
 const endRegionName = ref(null) as Ref<RegionName | null>;
@@ -112,6 +189,19 @@ const copyNumber = () => {
  }
 };

+const categoryRules = computed(() => {
+  if (!chosenCategory.value) return null;
+
+  return genData.categoriesRules[chosenCategory.value];
+});
+
+const randomizeCategory = () => {
+  const categoryKeys = Object.keys(genData.categoriesRules) as Category[];
+  chosenCategory.value = categoryKeys[~~(Math.random() * categoryKeys.length)];
+
+  randomizeTrainNumber(false);
+};
+
 const randomizeTrainNumber = (randomizeRegions = false) => {
  // if (categoryRules.value == null) return;

@@ -129,6 +219,7 @@ const randomizeTrainNumber = (randomizeRegions = false) => {

  let number = "";

+  // Two first numbers (begin & end regions)
  if (beginRegionName.value == endRegionName.value) {
    const sameRegionsNumbers = genData.sameRegions[beginRegionName.value!];
    const randRegionNumber =
@@ -147,32 +238,25 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
    return;
  }

+  // Choose default category if it's not chosen
  if (chosenCategory.value == null) chosenCategory.value = "EI";

-  const rulesArray = genData.categories[chosenCategory.value]
-    .split(";")
-    .map((r) => ({
-      index: r.split(":")[0],
-      rule: r.split(":")[1],
-      nums: Number(r.split(":")[2] || "1"),
-    }));
+  // Get category rules
+  const [thirdNumber, minRange, maxRange] = categoryRules.value!;

-  rulesArray.forEach((r) => {
-    const range = r.rule.split("-");
+  // Third number
+  number += thirdNumber ?? "";

-    if (range.length == 1) number += r.rule;
-    else {
-      const [minRange, maxRange] = range;
-      const randRange = Math.floor(
-        Math.random() * (Number(maxRange) - Number(minRange)) +
-          Number(minRange),
-      ).toString();
+  // Remaining numbers
+  const rangeNums = minRange!.length;
+  const randRange = Math.floor(
+    Math.random() * (Number(maxRange) - Number(minRange)) + Number(minRange),
+  ).toString();
+  const leadingZeros = new Array(Math.abs(randRange.length - rangeNums))
+    .fill("0")
+    .join("");

-      number +=
-        new Array(Math.abs(randRange.length - r.nums)).fill("0").join("") +
-        randRange;
-    }
-  });
+  number += `${leadingZeros}${randRange}`;

  trainNumber.value = number;
 };
@@ -182,14 +266,39 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
@import "../../styles/tab.scss";
@import "../../styles/global.scss";

-.options {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+label {
+  display: block;
+  font-weight: bold;
+  margin-bottom: 0.5em;
+}
+
+.category-select {
+  select {
+    width: auto;
+    min-width: 50%;
+  }
+
+  margin-bottom: 1em;
+}
+
+.regions-select {
+  display: flex;
+  align-items: center;
+  justify-content: center;
  gap: 0.5em;

+  div {
+    width: 100%;
+  }
+
  select {
    width: 100%;
  }
+
+  label {
+    display: block;
+    margin-bottom: 0.5em;
+  }
 }

 .generated-number {
@@ -204,14 +313,19 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
  background-color: $secondaryColor;
 }

+.category-rules {
+  margin-bottom: 0.5em;
+}
+
 .tab_actions {
-  grid-template-columns: 1fr 1fr;
+  grid-template-columns: repeat(3, 1fr);
  margin: 0.5em 0;
 }

 .tab_links {
  display: flex;
  justify-content: flex-end;
+  margin: 0.25em 0;
 }

@media screen and (max-width: $breakpointMd) {
@@ -221,8 +335,20 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
 }

@media screen and (max-width: $breakpointSm) {
-  .options select {
+  .regions-select {
+    flex-wrap: wrap;
+  }
+
+  .regions-select select {
    width: 100%;
  }
+
+  .category-select select {
+    min-width: 100%;
+  }
+
+  .category-rules {
+    text-align: center;
+  }
 }
 </style>
@@ -15,7 +15,7 @@
        <div class="tab_attributes">
          <label>
            {{ $t('stockgen.input-mass') }}
-            <input type="number" v-model="maxMass" step="100" max="4000" min="0" />
+            <input type="number" v-model="maxTons" step="100" max="4000" min="0" />
          </label>

          <label>
@@ -28,6 +28,12 @@
            <input type="number" v-model="maxCarCount" step="1" max="60" min="1" />
          </label>
        </div>
+
+        <!-- <hr style="margin: 1em 0" /> -->
+
+        <!-- <div class="generator_options">
+          <Checkbox v-model="isCarGroupingEnabled">Grupuj wylosowane wagony (ustawia podobne wagony obok siebie w składzie)</Checkbox>
+        </div>  -->
      </div>

      <div>
@@ -37,13 +43,13 @@

      <div class="generator_cargo">
        <button
-          v-for="(cargoArray, cargoName) in store.stockData?.generator.cargo"
-          :key="cargoName"
+          v-for="cargo in computedCargoData"
+          :key="cargo.name"
          class="btn"
-          :data-chosen="chosenCargoTypes.includes(cargoName.toString())"
-          @click="toggleCargoChosen(cargoName.toString(), cargoArray)"
+          :data-chosen="chosenCargoTypes.includes(cargo.name)"
+          @click="toggleCargoChosen(cargo.name, cargo.cargoList)"
        >
-          {{ $t(`cargo.${cargoName}`) }}
+          {{ $t(`cargo.${cargo.name}`) }}
        </button>
      </div>

@@ -105,7 +111,6 @@ import warningsMixin from '../../mixins/warningsMixin';

 export default defineComponent({
  name: 'stock-generator',
-
  mixins: [stockMixin, warningsMixin],

  data() {
@@ -117,10 +122,12 @@ export default defineComponent({

      previewTimeout: -1,

-      maxMass: 3000,
+      maxTons: 3000,
      maxLength: 650,
      maxCarCount: 50,

+      isCarGroupingEnabled: false,
+
      store: useStore(),
    };
  },
@@ -129,6 +136,19 @@ export default defineComponent({
    computedChosenCarTypes() {
      return new Set<string>(this.chosenCarTypes.slice().sort((c1, c2) => (c1 > c2 ? 1 : -1)));
    },
+
+    computedCargoData() {
+      if (!this.store.stockData?.generator.cargo) return [];
+
+      const cargoGeneratorData = this.store.stockData.generator.cargo;
+
+      return Object.keys(cargoGeneratorData)
+        .sort((v1, v2) => this.$t(`cargo.${v1}`).localeCompare(this.$t(`cargo.${v2}`)))
+        .map((v) => ({
+          name: v,
+          cargoList: cargoGeneratorData[v],
+        }));
+    },
  },

  methods: {
@@ -150,6 +170,15 @@ export default defineComponent({
      this.excludedCarTypes.length = 0;
    },

+    // WIP
+    groupStock(stockList: IStock[]) {
+      if (!this.isCarGroupingEnabled) return false;
+
+      stockList.sort((s1, s2) => {
+        return (s1.constructionType + s1.cargo?.id).localeCompare(s2.constructionType + s2.cargo?.id);
+      });
+    },
+
    generateStock(empty = false) {
      const generatedChosenStockList = this.chosenCargoTypes.reduce(
        (acc, type) => {
@@ -162,8 +191,8 @@ export default defineComponent({
              const cargoObjs = [] as (ICargo | undefined)[];

              if (!cargoType || empty) cargoObjs.push(undefined);
-              else if (cargoType == 'all') cargoObjs.push(...carWagonObjs[0]!.cargoList);
-              else cargoObjs.push(carWagonObjs[0]?.cargoList.find((cargo) => cargo.id == cargoType));
+              else if (cargoType == 'all') cargoObjs.push(...carWagonObjs[0]!.cargoTypes);
+              else cargoObjs.push(carWagonObjs[0]?.cargoTypes.find((cargo) => cargo.id == cargoType));

              carWagonObjs.forEach((cw) => {
                cargoObjs.forEach((cargoObj) => {
@@ -193,30 +222,29 @@ export default defineComponent({
      };

      for (let i = 0; i < 10; i++) {
-        const headingLoco = this.store.stockList[0]?.isLoco ? this.store.stockList[0] : undefined;
-        this.store.stockList.length = headingLoco ? 1 : 0;
+        this.store.stockList.splice(this.store.stockList[0]?.isLoco ? 1 : 0);

-        const maxMass = this.store.acceptableMass > 0 ? Math.min(this.store.acceptableMass, this.maxMass) : this.maxMass;
+        let carCount = 0;
+        const maxWeight = this.store.acceptableWeight > 0 ? Math.min(this.store.acceptableWeight, this.maxTons * 1000) : this.maxTons * 1000;

-        let exceeded = false;
-
-        while (!exceeded) {
+        // eslint-disable-next-line no-constant-condition
+        while (true) {
          const randomStockType = generatedChosenStockList[~~(Math.random() * generatedChosenStockList.length)];
          const { carWagon, cargo } = randomStockType.carPool[~~(Math.random() * randomStockType.carPool.length)];

          if (
-            this.store.totalMass + (cargo?.totalMass || carWagon.mass) > maxMass ||
+            this.store.totalWeight + (carWagon.weight + (cargo?.weight ?? 0)) > maxWeight ||
            this.store.totalLength + carWagon.length > this.maxLength ||
-            this.store.stockList.length > this.maxCarCount
+            carCount >= this.maxCarCount
          ) {
-            exceeded = true;
            break;
          }

          this.addCarWagon(carWagon, cargo);
+          carCount++;
        }

-        const currentGenerationValue = this.store.totalLength + this.store.totalMass + this.store.stockList.length;
+        const currentGenerationValue = this.store.totalLength + this.store.totalWeight + carCount;

        if (bestGeneration.value < currentGenerationValue) {
          bestGeneration.stockList = this.store.stockList;
@@ -224,6 +252,10 @@ export default defineComponent({
        }
      }

+      const bestStockList = bestGeneration.stockList;
+
+      this.groupStock(bestStockList);
+
      this.store.stockList = bestGeneration.stockList;
      this.store.stockSectionMode = 'stock-list';
    },
@@ -270,6 +302,11 @@ export default defineComponent({
@import '../../styles/global.scss';
@import '../../styles/tab.scss';

+h2 {
+  margin-top: 0;
+  margin-bottom: 0.5em;
+}
+
 .generator_cargo,
 .generator_vehicles {
  display: grid;
@@ -310,6 +347,12 @@ export default defineComponent({
  gap: 1em;
 }

+.generator_options {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5em;
+}
+
 .generator_warning {
  background-color: $accentColor;
  padding: 0.5em;
@@ -33,27 +33,17 @@
    </div>

    <div class="stock_controls" :data-disabled="store.chosenStockListIndex == -1">
-      <b v-if="store.chosenStockListIndex >= 0">
-        {{ $t('stocklist.vehicle-no') }}
-        <span class="text--accent">{{ store.chosenStockListIndex + 1 }}</span>
-        &nbsp;
-      </b>
-
-      <b v-else>
-        {{ $t('stocklist.no-vehicle-chosen') }}
-      </b>
-
-      <button class="btn" :tabindex="store.chosenStockListIndex == -1 ? -1 : 0" @click="moveUpStock(store.chosenStockListIndex)">
+      <button class="btn btn--image" :tabindex="store.chosenStockListIndex == -1 ? -1 : 0" @click="moveUpStock(store.chosenStockListIndex)">
        <img :src="getIconURL('higher')" alt="move up vehicle" />
        {{ $t('stocklist.action-move-up') }}
      </button>

-      <button class="btn" :tabindex="store.chosenStockListIndex == -1 ? -1 : 0" @click="moveDownStock(store.chosenStockListIndex)">
+      <button class="btn btn--image" :tabindex="store.chosenStockListIndex == -1 ? -1 : 0" @click="moveDownStock(store.chosenStockListIndex)">
        <img :src="getIconURL('lower')" alt="move down vehicle" />
        {{ $t('stocklist.action-move-down') }}
      </button>

-      <button class="btn" :tabindex="store.chosenStockListIndex == -1 ? -1 : 0" @click="removeStock(store.chosenStockListIndex)">
+      <button class="btn btn--image" :tabindex="store.chosenStockListIndex == -1 ? -1 : 0" @click="removeStock(store.chosenStockListIndex)">
        <img :src="getIconURL('remove')" alt="remove vehicle" />
        {{ $t('stocklist.action-remove') }}
      </button>
@@ -70,8 +60,8 @@

      <span>
        {{ $t('stocklist.mass') }}
-        <span class="text--accent">{{ store.totalMass }}t</span> ({{ $t('stocklist.mass-accepted') }}:
-        <span class="text--accent">{{ store.acceptableMass ? store.acceptableMass + 't' : '-' }}</span
+        <span class="text--accent">{{ (store.totalWeight / 1000).toFixed(1) }}t</span> ({{ $t('stocklist.mass-accepted') }}:
+        <span class="text--accent">{{ store.acceptableWeight ? `${~~(store.acceptableWeight / 1000)}t` : '-' }}</span
        >) - {{ $t('stocklist.length') }}:
        <span class="text--accent">{{ store.totalLength }}m</span>
        - {{ $t('stocklist.vmax') }}:
@@ -79,11 +69,14 @@
      </span>
    </div>

-    <div class="stock_cold-start">
-      <label>
-        <input type="checkbox" v-model="store.isColdStart" :disabled="!locoSupportsColdStart(store.stockList[0]?.constructionType || '')" />
+    <div class="stock_spawn-settings">
+      <Checkbox v-if="store.stockSupportsColdStart" v-model="store.isColdStart">
        {{ $t('stocklist.coldstart-info') }}
-      </label>
+      </Checkbox>
+
+      <Checkbox v-if="store.stockSupportsDoubleManning" v-model="store.isDoubleManned">
+        {{ $t('stocklist.doublemanning-info') }}
+      </Checkbox>
    </div>

    <div class="stock_warnings" v-if="stockHasWarnings">
@@ -97,7 +90,7 @@
        (!)
        <i18n-t keypath="stocklist.warning-too-heavy">
          <template #href>
-            <a target="_blank" href="https://docs.google.com/spreadsheets/d/1bFXUsHsAu4youmNz-46Q1HslZaaoklvfoBDS553TnNk/edit">
+            <a target="_blank" href="https://docs.google.com/spreadsheets/d/1KVa5vn2d8XGkXQFwbavVudwKqUQxbLOucHWs2VYqAUE">
              {{ $t('stocklist.acceptable-mass-docs') }}
            </a>
          </template>
@@ -117,7 +110,7 @@
        <div class="stock-info">{{ $t('stocklist.list-empty') }}</div>
      </li>

-      <TransitionGroup name="stock-list-anim">
+      <TransitionGroup name="stock-list-anim" v-else>
        <li
          v-for="(stock, i) in store.stockList"
          :key="stock.id"
@@ -143,9 +136,9 @@
            <span class="stock-info__cargo" v-if="stock.cargo">
              {{ stock.cargo.id }}
            </span>
-            <span class="stock-info__length"> {{ stock.length }}m </span>
-            <span class="stock-info__mass">{{ stock.cargo ? stock.cargo.totalMass : stock.mass }}t </span>
-            <span class="stock-info__speed"> {{ stock.maxSpeed }}km/h </span>
+            <span class="stock-info__length">{{ stock.length }}m</span>
+            <span class="stock-info__mass">{{ ((stock.weight + (stock.cargo?.weight ?? 0)) / 1000).toFixed(1) }}t</span>
+            <span class="stock-info__speed">{{ stock.maxSpeed }}km/h</span>
          </div>
        </li>
      </TransitionGroup>
@@ -158,16 +151,16 @@ import { defineComponent } from 'vue';

 import { useStore } from '../../store';

-import { locoSupportsColdStart } from '../../utils/locoUtils';
 import warningsMixin from '../../mixins/warningsMixin';
 import imageMixin from '../../mixins/imageMixin';
 import stockPreviewMixin from '../../mixins/stockPreviewMixin';
 import StockThumbnails from '../utils/StockThumbnails.vue';
 import stockMixin from '../../mixins/stockMixin';
+import Checkbox from '../common/Checkbox.vue';

 export default defineComponent({
  name: 'stock-list',
-  components: { StockThumbnails },
+  components: { StockThumbnails, Checkbox },

  mixins: [warningsMixin, imageMixin, stockMixin, stockPreviewMixin],

@@ -188,12 +181,19 @@ export default defineComponent({

  computed: {
    stockString() {
+      if (this.store.stockList.length == 0) return '';
+
+      const includeColdStart = this.store.isColdStart && this.store.stockSupportsColdStart;
+      const includeDoubleManned = this.store.isDoubleManned && this.store.stockSupportsDoubleManning;
+
      return this.store.stockList
        .map((stock, i) => {
          let stockTypeStr = stock.isLoco || !stock.cargo ? stock.type : `${stock.type}:${stock.cargo.id}`;
-          let coldStart = i == 0 && this.store.isColdStart && locoSupportsColdStart(stock.constructionType || '') ? ',c' : '';

-          return stockTypeStr + coldStart;
+          if (i == 0 && (includeColdStart || includeDoubleManned))
+            return `${stockTypeStr},${includeColdStart ? 'c' : ''}${includeDoubleManned ? 'd' : ''}`;
+
+          return stockTypeStr;
        })
        .join(';');
    },
@@ -212,8 +212,6 @@ export default defineComponent({
  },

  methods: {
-    locoSupportsColdStart,
-
    copyToClipboard() {
      navigator.clipboard.writeText(this.stockString);

@@ -326,7 +324,7 @@ export default defineComponent({
    downloadStock() {
      if (this.store.stockList.length == 0) return alert(this.$t('stocklist.alert-empty'));

-      const defaultName = `${this.store.chosenRealStockName || this.store.stockList[0].type} ${this.store.totalMass}t; ${
+      const defaultName = `${this.store.chosenRealStockName || this.store.stockList[0].type} ${(this.store.totalWeight / 1000).toFixed(1)}t; ${
        this.store.totalLength
      }m; vmax ${this.store.maxStockSpeed}`;

@@ -400,8 +398,9 @@ export default defineComponent({
@import '../../styles/tab.scss';

 .stock-list-tab {
-  display: grid;
-  grid-gap: 0.5em;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5em;
 }

 .warning {
@@ -421,9 +420,9 @@ export default defineComponent({
  display: flex;
  justify-content: center;
  align-items: center;
+  flex-wrap: wrap;

  gap: 0.5em;
-  flex-wrap: wrap;

  padding: 0.5em;

@@ -438,21 +437,6 @@ export default defineComponent({

    pointer-events: none;
  }
-
-  input#stock-count {
-    width: 3em;
-
-    margin: 0;
-    padding: 0.25em;
-    outline: none;
-    border: none;
-  }
-
-  button {
-    img {
-      margin-right: 0.25em;
-    }
-  }
 }

 .stock_actions {
@@ -472,6 +456,11 @@ export default defineComponent({
  }
 }

+.stock_spawn-settings {
+  display: flex;
+  gap: 0.5em;
+}
+
 .real-stock-info {
  img {
    height: 1.3ch;
@@ -481,7 +470,7 @@ export default defineComponent({
 ul {
  position: relative;
  overflow: auto;
-  height: 500px;
+  max-height: 500px;
 }

 ul > li {
@@ -54,19 +54,25 @@
                />
              </td>

-              <td :data-sponsoronly="vehicle.isSponsorsOnly">{{ vehicle.type }}</td>
+              <td :data-sponsoronly="vehicle.isSponsorsOnly">
+                {{ vehicle.type }}
+              </td>

-              <td v-if="isLocomotive(vehicle)">{{ $t(`wiki.${vehicle.power}`) }}</td>
+              <td v-if="isLocomotive(vehicle)">
+                {{ $t(`wiki.${vehicle.power}`) }}
+              </td>
              <td v-else>{{ $t(`wiki.${vehicle.useType}`) }}</td>

              <td>{{ vehicle.constructionType }}</td>
              <td>{{ vehicle.length }}m</td>
-              <td>{{ vehicle.mass }}t</td>
+              <td>{{ (vehicle.weight / 1000).toFixed(1) }}t</td>
              <td>{{ vehicle.maxSpeed }}km/h</td>

-              <td v-if="currentFilterMode == 'carriages'">{{ !isLocomotive(vehicle) ? vehicle.cargoList.length : '---' }}</td>
+              <td v-if="currentFilterMode == 'carriages'">
+                {{ !isLocomotive(vehicle) ? vehicle.cargoTypes.length : '---' }}
+              </td>
              <td v-if="currentFilterMode == 'tractions'">
-                {{ isLocomotive(vehicle) ? (locoSupportsColdStart(vehicle.constructionType) ? `&check;` : '&cross;') : '---' }}
+                {{ isLocomotive(vehicle) ? (vehicle.coldStart ? `&check;` : '&cross;') : '---' }}
              </td>
            </tr>
          </tbody>
@@ -86,9 +92,8 @@ import { Vehicle } from '../../types';
 import { isLocomotive } from '../../utils/vehicleUtils';
 import stockMixin from '../../mixins/stockMixin';
 import imageMixin from '../../mixins/imageMixin';
-import { locoSupportsColdStart } from '../../utils/locoUtils';

-type SorterID = 'type' | 'constructionType' | 'image' | 'length' | 'mass' | 'maxSpeed' | 'cargoCount' | 'group' | 'coldStart';
+type SorterID = 'type' | 'constructionType' | 'image' | 'length' | 'weight' | 'maxSpeed' | 'cargoCount' | 'group' | 'coldStart';

 interface IWikiHeader {
  id: SorterID;
@@ -107,7 +112,7 @@ const headers: IWikiHeader[] = [
  { id: 'group', sortable: true, for: 'all' },
  { id: 'constructionType', sortable: true, for: 'all' },
  { id: 'length', sortable: true, for: 'all' },
-  { id: 'mass', sortable: true, for: 'all' },
+  { id: 'weight', sortable: true, for: 'all' },
  { id: 'maxSpeed', sortable: true, for: 'all' },
  { id: 'coldStart', sortable: true, for: 'tractions' },
  { id: 'cargoCount', sortable: true, for: 'carriages' },
@@ -143,7 +148,6 @@ export default defineComponent({
  },

  methods: {
-    locoSupportsColdStart,
    isLocomotive,

    toggleFilter(name: typeof this.currentFilterMode) {
@@ -168,19 +172,22 @@ export default defineComponent({
        case 'group':
          return direction == 1 ? row1.vehicle[id].localeCompare(row2.vehicle[id]) : row2.vehicle[id].localeCompare(row1.vehicle[id]);

-        case 'mass':
+        case 'weight':
        case 'length':
        case 'maxSpeed':
          return Math.sign(row1.vehicle[id] - row2.vehicle[id]) * direction;

        case 'cargoCount':
          return (
-            (!isLocomotive(row1.vehicle) ? Math.sign(row1.vehicle.cargoList.length || -1) : -1) -
-            (!isLocomotive(row2.vehicle) ? (row2.vehicle.cargoList.length || -1) * direction : -1)
+            (!isLocomotive(row1.vehicle) ? Math.sign(row1.vehicle.cargoTypes.length || -1) : -1) -
+            (!isLocomotive(row2.vehicle) ? (row2.vehicle.cargoTypes.length || -1) * direction : -1)
          );

        case 'coldStart':
-          return (locoSupportsColdStart(row1.vehicle.constructionType) > locoSupportsColdStart(row2.vehicle.constructionType) ? 1 : -1) * direction;
+          return (
+            ((isLocomotive(row1.vehicle) && row1.vehicle.coldStart ? 1 : -1) - (isLocomotive(row2.vehicle) && row2.vehicle.coldStart ? 1 : -1)) *
+            direction
+          );

        default:
          break;
@@ -200,8 +207,6 @@ export default defineComponent({
            (this.currentFilterMode == 'all' ||
              (this.currentFilterMode == 'tractions' && isLocomotive(vehicle)) ||
              (this.currentFilterMode == 'carriages' && !isLocomotive(vehicle))),
-
-          // ((this.filters.tractions && isLocomotive(vehicle)) || (this.filters.carriages && !isLocomotive(vehicle))),
        }))
        .sort((a, b) => this.sortTableRows(a, b));
    },
@@ -291,6 +296,7 @@ export default defineComponent({
  td {
    text-align: center;
    height: 70px;
+    padding: 0.25em;

    &[data-sponsoronly='true'] {
      color: salmon;
@@ -1,46 +1,45 @@
 <template>
-  <div class="stock_thumbnails" ref="thumbnailsRef">
+  <div class="stock-thumbnails" ref="thumbnailsRef">
    <div
+      class="thumbnail-item"
      v-for="(stock, stockIndex) in store.stockList"
      :key="stockIndex"
      :data-selected="store.chosenStockListIndex == stockIndex"
+      :data-sponsor="stock.isSponsorsOnly"
      draggable="true"
      @dragstart="onDragStart(stockIndex)"
      @drop="onDrop($event, stockIndex)"
      @dragover="allowDrop"
+      @click="onListItemClick(stockIndex)"
    >
-      <span @click="onListItemClick(stockIndex)" :key="stock.id">
-        <b :class="{ sponsor: stock.isSponsorsOnly }">
-          {{ stock.type }}
-        </b>
+      <b>
+        {{ stock.type }}
+      </b>

-        <span>
-          <img
-            draggable="false"
-            :src="`https://rj.td2.info.pl/dist/img/thumbnails/${stock.type}.png`"
-            :alt="stock.type"
-            :title="stock.type"
-            @error="stockImageError($event, stock)"
-          />
-        </span>
-      </span>
+      <img
+        draggable="false"
+        :src="`https://rj.td2.info.pl/dist/img/thumbnails/${stock.type}.png`"
+        :alt="stock.type"
+        :title="stock.type"
+        @error="stockImageError($event, stock)"
+      />
    </div>
  </div>
 </template>

 <script setup lang="ts">
-import { Ref, computed, nextTick, ref, watch } from 'vue';
-import { useStore } from '../../store';
-import { IStock } from '../../types';
+import { Ref, computed, nextTick, ref, watch } from "vue";
+import { useStore } from "../../store";
+import { IStock } from "../../types";

 const store = useStore();
-const emit = defineEmits(['listItemClick']);
+const emit = defineEmits(["listItemClick"]);

 const thumbnailsRef = ref() as Ref<HTMLElement>;
 const draggedIndex = ref(-1);

 const onListItemClick = (index: number) => {
-  emit('listItemClick', index);
+  emit("listItemClick", index);
 };

 const stockImageError = (e: Event, stock: IStock) => {
@@ -53,13 +52,15 @@ watch(
    if (index < 0) return;

    nextTick(() => {
-      (thumbnailsRef.value as HTMLElement).querySelector(`div:nth-child(${index + 1})`)?.scrollIntoView({
-        block: 'nearest',
-        inline: 'start',
-        behavior: 'smooth',
-      });
+      (thumbnailsRef.value as HTMLElement)
+        .querySelector(`div:nth-child(${index + 1})`)
+        ?.scrollIntoView({
+          block: "nearest",
+          inline: "start",
+          behavior: "smooth",
+        });
    });
-  }
+  },
 );

 // Dragging images
@@ -70,7 +71,9 @@ const onDragStart = (vehicleIndex: number) => {
 const onDrop = (e: DragEvent, vehicleIndex: number) => {
  e.preventDefault();

-  let targetEl = thumbnailsRef.value.querySelector(`div:nth-child(${vehicleIndex + 1})`);
+  let targetEl = thumbnailsRef.value.querySelector(
+    `div:nth-child(${vehicleIndex + 1})`,
+  );

  if (!targetEl && draggedIndex.value != -1) return;

@@ -87,41 +90,45 @@ const allowDrop = (e: DragEvent) => {
 </script>

 <style lang="scss" scoped>
-.stock_thumbnails {
+.stock-thumbnails {
  display: flex;
  overflow: auto;
  background-color: #353a57;
+}

-  > div {
-    display: flex;
-    align-items: flex-end;
-    cursor: pointer;
-    min-height: 100px;
+.thumbnail-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;

-    &[data-selected='true'] {
-      background-color: rebeccapurple;
-    }
+  flex-direction: column;
+  gap: 0.5em;

-    > span {
-      display: flex;
-      flex-direction: column;
-      gap: 0.5em;
-      padding: 0.5em 0;
+  padding-top: 0.5em;

-      text-align: center;
+  cursor: pointer;
+  min-height: 100px;
+  font-size: 0.85em;

-      font-size: 0.85em;
-      user-select: none;
-      -moz-user-select: none;
-    }
+  user-select: none;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+
+  &[data-selected="true"] {
+    background-color: rebeccapurple;
+  }
+
+  b {
+    color: #ccc;
+    margin: 0 1em;
+  }
+
+  &[data-sponsor="true"] > b {
+    color: salmon;
  }

  img {
    max-height: 60px;
  }
 }
-
-.sponsor {
-  color: salmon;
-}
 </style>
@@ -0,0 +1,11 @@
+{
+  "EU06": [650000, 2000000],
+  "EU07": [650000, 2000000],
+  "4E": [650000, 2000000],
+  "EU07E": [650000, 2000000],
+  "EP07": [650000, 650000],
+  "EP08": [650000, 650000],
+  "EP09": [800000, 800000],
+  "ET41": [700000, 4000000],
+  "SM42": [2400000, 2400000]
+}
@@ -1,37 +1,70 @@
 {
  "regionNumbers": {
-    "Warszawa": 1,
-    "Lublin": 2,
-    "Kraków": 3,
-    "Sosnowiec": 4,
-    "Gdańsk": 5,
-    "Wrocław": 6,
-    "Poznań": 7,
-    "Szczecin": 8,
-    "Rezerwa": 9
+    "Warszawa (1)": 1,
+    "Lublin (2)": 2,
+    "Kraków (3)": 3,
+    "Sosnowiec (4)": 4,
+    "Gdańsk (5)": 5,
+    "Wrocław (6)": 6,
+    "Poznań (7)": 7,
+    "Szczecin (8)": 8,
+    "Rezerwa (9)": 9
  },
  "sameRegions": {
    "Losowy": [
-      10, 11, 19, 91, 93, 97, 99, 20, 22, 29, 30, 33, 39, 40, 44, 49, 94, 50,
-      55, 59, 90, 95, 96, 66, 60, 69, 77, 70, 79, 88, 80, 89, 92, 98
+      10, 11, 19, 91, 93, 97, 99, 20, 22, 29, 30, 33, 39, 40, 44, 49, 94, 50, 55, 59, 90, 95, 96, 66, 60, 69, 77, 70, 79, 88, 80, 89, 92, 98
    ],
-    "Warszawa": [10, 11, 19, 91, 93, 97, 99],
-    "Lublin": [20, 22, 29],
-    "Kraków": [30, 33, 39],
-    "Sosnowiec": [40, 44, 49, 94],
-    "Gdańsk": [50, 55, 59, 90, 95, 96],
-    "Wrocław": [66, 60, 69],
-    "Poznań": [77, 70, 79],
-    "Szczecin": [88, 80],
-    "Rezerwa": [89, 92, 98]
+    "Warszawa (1)": [10, 11, 19, 91, 93, 97, 99],
+    "Lublin (2)": [20, 22, 29],
+    "Kraków (3)": [30, 33, 39],
+    "Sosnowiec (4)": [40, 44, 49, 94],
+    "Gdańsk (5)": [50, 55, 59, 90, 95, 96],
+    "Wrocław (6)": [66, 60, 69],
+    "Poznań (7)": [77, 70, 79],
+    "Szczecin (8)": [88, 80],
+    "Rezerwa (9)": [89, 92, 98]
  },
-  "categories": {
-    "EI": "2:00-99:2",
-    "MP/RP": "2:050-169:3",
-    "RO": "2:200-999:3",
-    "PW": "2:6;3:0-899:3",
-    "TM": "2:4;3:0-899:3",
-    "TK": "2:3;3:0-899:3",
-    "LT": "2:5;3:0-899:3"
+  "categoriesRules": {
+    "EI": [null, "00", "99"],
+    "MP": [null, "050", "169"],
+    "RO": [null, "200", "999"],
+    "RP": [null, "050", "169"],
+    "PW": ["6", "000", "899"],
+    "TK": ["3", "000", "899"],
+    "TM": ["4", "000", "899"],
+    "LT": ["5", "000", "899"]
+  },
+  "categoriesNextVersion": {
+    "EI": [null, "00", "99"],
+    "EC": [null, "001", "049"],
+    "EN": [null, "001", "049"],
+
+    "RO": [null, "200", "999"],
+    "RP": [null, "050", "169"],
+    "RM": [null, "200", "999"],
+    "RA": [null, "200", "999"],
+
+    "MO": [null, "200", "999"],
+    "MP": [null, "050", "169"],
+    "MM": [null, "001", "049"],
+    "MH": [null, "170", "199"],
+
+    "PW": ["6", "000", "899"],
+    "PX": ["6", "000", "899"],
+
+    "TC": ["0", "000", "899"],
+    "TG": ["1", "000", "899"],
+    "TR": ["1", "000", "899"],
+    "TD": ["2", "000", "899"],
+    "TK": ["3", "000", "899"],
+    "TN": ["3", "000", "899"],
+    "TM": ["4", "000", "899"],
+    "TS": ["5", "000", "899"],
+
+    "LT": ["5", "000", "899"],
+    "LP": ["6", "000", "899"],
+    "LS": ["9", "000", "899"],
+
+    "ZN": ["9", "000", "899"]
  }
 }
@@ -1,66 +1,82 @@
 {
  "EU07": {
    "passenger": {
-      "650": 125
+      "650000": 125
    },
    "cargo": {
-      "2000": 70
-    }
+      "2000000": 70
+    },
+    "none": 110
+  },
+  "4E": {
+    "passenger": {
+      "650000": 125
+    },
+    "cargo": {
+      "2000000": 70
+    },
+    "none": 110
  },
  "EU07E": {
    "passenger": {
-      "650": 125
+      "650000": 125
    },
    "cargo": {
-      "2000": 70
-    }
+      "2000000": 70
+    },
+    "none": 110
  },
  "EP07": {
    "passenger": {
-      "650": 125
+      "650000": 125
    },
-    "cargo": null
+    "cargo": null,
+    "none": 110
  },
  "EP08": {
    "passenger": {
-      "650": 140
+      "650000": 140
    },
-    "cargo": null
+    "cargo": null,
+    "none": 110
  },
  "EP09": {
    "passenger": {
-      "650": 160
+      "650000": 160
    },
-    "cargo": null
+    "cargo": null,
+    "none": 160
  },
  "ET41": {
    "passenger": {
-      "700": 125
+      "700000": 125
    },
    "cargo": {
-      "4000": 70
-    }
+      "4000000": 70
+    },
+    "none": 110
  },
  "SM42": {
    "passenger": {
-      "95": 90,
-      "200": 80,
-      "300": 70,
-      "450": 60,
-      "750": 50,
-      "1130": 40,
-      "1720": 30,
-      "2400": 20
+      "95000": 90,
+      "200000": 80,
+      "300000": 70,
+      "450000": 60,
+      "750000": 50,
+      "1130000": 40,
+      "1720000": 30,
+      "2400000": 20
    },
    "cargo": {
-      "95": 90,
-      "200": 80,
-      "300": 70,
-      "450": 60,
-      "750": 50,
-      "1130": 40,
-      "1720": 30,
-      "2400": 20
-    }
+      "95000": 90,
+      "200000": 80,
+      "300000": 70,
+      "450000": 60,
+      "750000": 50,
+      "1130000": 40,
+      "1720000": 30,
+      "2400000": 20
+    },
+    "none": 90
  }
 }
@@ -64,7 +64,8 @@
    "mass-accepted": "accepted",
    "length": "Length",
    "vmax": "vMax",
-    "coldstart-info": "Cold start heading locomotive (only locos 303E & 203E type)",
+    "coldstart-info": "Locomotive cold start",
+    "doublemanning-info": "Double manning",
    "list-empty": "Stock list is empty!",
    "warning-not-suitable": "EP07 & EP08 type locomotives are designed for passenger traffic only!",
    "warning-passenger-too-long": "Maximum length of a passenger train may not be greater than 350m!",
@@ -91,33 +92,68 @@
  },
  "numgen": {
    "title": "TRAIN NUMBER GENERATOR",
+    "subtitle": "Generates real train number based on Polish railway instruction Ir-11",
    "alert": "The number has been copied to your clipboard!",
    "start-region": "Beginning construction region",
    "end-region": "Terminating construction region",
    "train-category": "Train category",
    "number-info": "Generated train number:",
    "warning": "Choose category and (optionally) construction regions",
-    "td2-wiki": "> Polish rules of train numbering (TD2 wiki)",
-    "td2-wiki-link": "https://wiki.td2.info.pl/index.php?title=Zasady_numeracji_poci%C4%85g%C3%B3w/en",
+    "td2-wiki": "> Polish rules of train numbering (forum thread)",
+    "td2-wiki-link": "https://td2.info.pl/english-boards/new-train-categories-in-the-simulator/",
    "action-random-region": "DRAW REGIONS",
-    "action-random-number": "DRAW A NUMBER",
-    "categories": {
-      "EI": "domestic express (EI)",
-      "MP/RP": "(inter)voivodeship bullet (MP/RP)",
-      "RO": "regional passenger (RO)",
-      "PW": "empty passenger (PW)",
-      "TM": "mass transport freight (TM)",
-      "TK": "non-mass transport freight (TK)",
-      "LT": "locomotive alone (LT)"
-    },
+    "action-random-number": "DRAW LAST DIGITS",
+    "action-random-category": "DRAW A CATEGORY",
+
    "rules": {
-      "EI": "4 digits - ends within the range of 00-99",
-      "MP/RP": "5 digits - ends within the range of 050-169",
-      "RO": "5 digits - ends within the range of 200-999",
-      "PW": "6 digits - '6' on the 3rd place; ends within the range of 000-899",
-      "TM": "6 digits - '4' on the 3rd place; ends within the range of 000-899",
-      "TK": "6 digits - '3' on the 3rd place; ends within the range of 000-899",
-      "LT": "6 digits - '5' on the 3rd place; ends within the range of 000-899"
+      "first-digit": "First digit:",
+      "second-digit": "Second digit:",
+      "third-digit": "Third digit:",
+      "two-first-digits": "Two first digits:",
+      "two-last-digits": "Two last digits:",
+      "three-last-digits": "Three last digits:",
+      "from-pool": "from pool of",
+      "for-category": "for category",
+      "for-region": "for region",
+      "for-region-begin": "for the beginning construction region",
+      "for-region-end": "for the terminating construction region",
+      "from-range": "from range of"
+    },
+
+    "categories": {
+      "EI": "EI - domestic express",
+      "EC": "EC - international express",
+      "EN": "EN - domestic night express",
+
+      "MP": "MP - intervoivodeship bullet",
+      "RP": "RP - voivodeship bullet",
+      "MO": "MO - intervoivodeship regio",
+      "RO": "RO - voivodeship regio",
+
+      "MM": "MM - international bullet",
+      "MH": "MH - intervoivodeship bullet (night / hotel)",
+      "RM": "RM - international voivodeship regio",
+      "RA": "RA - voivodeship regio (urban)",
+
+      "PW": "PW - empty passenger",
+      "PX": "PX - empty passenger test drive",
+
+      "TC": "TC - international freight (intermodal)",
+      "TG": "TG - international freight (cargo)",
+      "TR": "TR - international freight (no cargo)",
+      "TD": "TD - domestic freight (intermodal)",
+      "TM": "TM - domestic freight (cargo)",
+      "TN": "TN - domestic freight (no cargo)",
+      "TK": "TK - freight (stations & sidings service)",
+      "TS": "TS - empty freight test drive",
+
+      "LT": "LT - locomotive only",
+      "LT-new": "LT - freight locomotive only",
+
+      "LP": "LP - passenger locomotive only",
+      "LS": "LS - shunting locomotive",
+
+      "ZN": "ZN - inspection / diagnostic"
    }
  },
  "wiki": {
@@ -132,7 +168,7 @@
      "constructionType": "Construction",
      "coldStart": "Cold start",
      "length": "Length",
-      "mass": "Mass",
+      "weight": "Mass",
      "maxSpeed": "Speed",
      "cargoCount": "Cargo count"
    },
@@ -29,7 +29,7 @@
    "title": "PODGLĄD WYBRANEGO POJAZDU",
    "loading": "ŁADOWANIE OBRAZU...",
    "desc": "Wybierz pojazd lub wagon, aby zobaczyć jego podgląd powyżej",
-    "sponsor-only":  "* TYLKO DLA SPONSORÓW DO {0}",
+    "sponsor-only": "* TYLKO DLA SPONSORÓW DO {0}",
    "loco-e": "ELEKTROWÓZ",
    "loco-s": "SPALINOWÓZ",
    "loco-ezt": "EZT",
@@ -64,7 +64,8 @@
    "mass-accepted": "dopuszczalna",
    "length": "Długość",
    "vmax": "vMax",
-    "coldstart-info": "Zimny start lokomotywy czołowej (tylko elektrowozy typów 303E i 203E)",
+    "coldstart-info": "Zimny start",
+    "doublemanning-info": "Podwójna obsada",
    "list-empty": "Lista pojazdów jest pusta!",
    "warning-not-suitable": "Lokomotywy EP07 i EP08 są przeznaczone jedynie do ruchu pasażerskiego!",
    "warning-passenger-too-long": "Maksymalna długość składów pasażerskich nie może przekraczać 350m!",
@@ -91,33 +92,68 @@
  },
  "numgen": {
    "title": "GENERATOR NUMERU POCIĄGU",
+    "subtitle": "Generuje realny numer pociągu na podstawie instrukcji Ir-11",
    "alert": "Numer został skopiowany do twojego schowka!",
    "start-region": "Początkowy obszar konstrukcyjny",
    "end-region": "Końcowy obszar konstrukcyjny",
    "train-category": "Kategoria pociągu",
    "number-info": "Wygenerowany numer pociągu:",
    "warning": "Wybierz kategorię oraz (opcjonalnie) obszary konstrukcyjne",
-    "td2-wiki": "> Szczegółowe zasady numeracji (wikipedia TD2)",
-    "td2-wiki-link": "https://wiki.td2.info.pl/index.php?title=Zasady_numeracji_poci%C4%85g%C3%B3w",
+    "td2-wiki": "> Szczegółowe zasady numeracji (wątek forum)",
+    "td2-wiki-link": "https://td2.info.pl/ogloszenia/nowe-kategorie-pociagow-w-symulatorze/",
    "action-random-region": "LOSUJ OBSZARY",
-    "action-random-number": "LOSUJ NUMER",
-    "categories": {
-      "EI": "ekspres krajowy (EI)",
-      "MP/RP": "(między)wojewódzki pośpieszny (MP/RP)",
-      "RO": "wojewódzki osobowy (RO)",
-      "PW": "próżny \"służbowy\" (PW)",
-      "TM": "towarowy do przewozów masowych (TM)",
-      "TK": "towarowy do obsługi stacji (TK)",
-      "LT": "lokomotywa luzem (LT)"
-    },
+    "action-random-number": "LOSUJ KOŃCÓWKĘ",
+    "action-random-category": "LOSUJ KATEGORIĘ",
+
    "rules": {
-      "EI": "4 cyfry - końcówka z przedziału 00-99",
-      "MP/RP": "5 cyfr - końcówka z przedziału 050-169",
-      "RO": "5 cyfr - końcówka z przedziału 200-999",
-      "PW": "6 cyfr - '6' na 3. miejscu; końcówka z przedziału 000-899",
-      "TM": "6 cyfr - '4' na 3. miejscu; końcówka z przedziału 000-899",
-      "TK": "6 cyfr - '3' na 3. miejscu; końcówka z przedziału 000-899",
-      "LT": "6 cyfr - '5' na 3. miejscu; końcówka z przedziału 000-899"
+      "first-digit": "Pierwsza cyfra:",
+      "second-digit": "Druga cyfra:",
+      "third-digit": "Trzecia cyfra:",
+      "two-first-digits": "Dwie pierwsze cyfry:",
+      "two-last-digits": "Dwie ostatnie cyfry:",
+      "three-last-digits": "Trzy ostatnie cyfry:",
+      "from-pool": "z puli",
+      "for-category": "dla kategorii",
+      "for-region": "dla obszaru",
+      "for-region-begin": "dla początkowego obszaru konstrukcyjnego",
+      "for-region-end": "dla końcowego obszaru konstrukcyjnego",
+      "from-range": "z przedziału"
+    },
+
+    "categories": {
+      "EI": "EI - ekspres krajowy",
+      "EC": "EC - ekspres międzynarodowy",
+      "EN": "EN - ekspres krajowy nocny",
+
+      "MP": "MP - międzywojewódzki pośpieszny",
+      "RP": "RP - wojewódzki pośpieszny",
+      "MO": "MO - międzywojewódzki osobowy",
+      "RO": "RO - wojewódzki osobowy",
+
+      "MM": "MM - międzynarodowy pośpieszny",
+      "MH": "MH - międzywoj. pośpieszny nocny / hotelowy",
+      "RM": "RM - wojewódzki osobowy międzynarodowy",
+      "RA": "RA - wojewódzki osobowy algomeracyjny",
+
+      "PW": "PW - pasażerski próżny (\"służbowy\")",
+      "PX": "PX - pasażerski próżny próbny",
+
+      "TC": "TC - towarowy międzynarodowy intermodalny",
+      "TG": "TG - towarowy międzynarodowy masowy",
+      "TR": "TR - towarowy międzynarodowy niemasowy",
+      "TD": "TD - towarowy krajowy intermodalny",
+      "TM": "TM - towarowy krajowy masowy",
+      "TN": "TN - towarowy krajowy niemasowy",
+      "TK": "TK - towarowy do obsługi stacji i bocznic",
+      "TS": "TS - towarowy próżny próbny",
+
+      "LT": "LT - lokomotywa luzem",
+      "LT-new": "LT - lokomotywa towarowa luzem",
+
+      "LP": "LP - lokomotywa pasażerska luzem",
+      "LS": "LS - lokomotywa manewrowa",
+
+      "ZN": "ZN - inspekcyjny / diagnostyczny"
    }
  },
  "wiki": {
@@ -132,7 +168,7 @@
      "constructionType": "Konstrukcja",
      "coldStart": "Zimny start",
      "length": "Długość",
-      "mass": "Masa",
+      "weight": "Masa",
      "maxSpeed": "Prędkość",
      "cargoCount": "Ładunki"
    },
@@ -141,7 +177,7 @@
    "loco-s": "Spalinowóz",
    "loco-e": "Elektrowóz",
    "car-passenger": "Wagon pasażerski",
-    "car-cargo": "Wagon towarowy" 
+    "car-cargo": "Wagon towarowy"
  },
  "realstock": {
    "title": "ZESTAWIENIA REALNE by",
@@ -1,13 +1,8 @@
 import { createApp } from "vue";
 import { createPinia } from "pinia";
-import { registerSW } from "virtual:pwa-register";

 import App from "./App.vue";
 import i18n from "./i18n-setup";
 const pinia = createPinia();

-registerSW({
-  immediate: true,
-});
-
 createApp(App).use(pinia).use(i18n).mount("#app");
@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue';
 import { useStore } from '../store';
-import { ICargo, ICarWagon, ILocomotive, IStock, Vehicle } from '../types';
+import { ICarWagon, ILocomotive, IStock, ICargo, Vehicle } from '../types';
 import { isLocomotive } from '../utils/vehicleUtils';

 export default defineComponent({
@@ -22,7 +22,7 @@ export default defineComponent({
        id: this.getStockId(),
        type: vehicle.type,
        length: vehicle.length,
-        mass: vehicle.mass,
+        weight: vehicle.weight,
        maxSpeed: vehicle.maxSpeed,
        isLoco,
        cargo: !isLoco && vehicle.loadable && cargo ? cargo : undefined,
@@ -73,19 +73,25 @@ export default defineComponent({
        let vehicle: Vehicle | null = null;
        let vehicleCargo: ICargo | null = null;

-        if (/^(EU|EP|ET|SM|EN|2EN|SN)/.test(type)) {
-          const [locoType, coldStart] = type.split(',');
+        const isLoco = /^(EU|EP|ET|SM|EN|2EN|SN)/.test(type);
+
+        if (isLoco) {
+          const [locoType, spawnProps] = type.split(',');
          vehicle = this.store.locoDataList.find((loco) => loco.type == locoType) || null;

-          if (i == 0 && coldStart == 'c') this.store.isColdStart = true;
+          // Spawn settings
+          if (i == 0 && spawnProps) {
+            this.store.isColdStart = spawnProps.includes('c');
+            this.store.isDoubleManned = spawnProps.includes('d');
+          }
        } else {
          const [carType, cargo] = type.split(':');
          vehicle = this.store.carDataList.find((car) => car.type == carType) || null;

-          if (cargo) vehicleCargo = vehicle?.cargoList.find((c) => c.id == cargo) || null;
+          if (cargo) vehicleCargo = vehicle?.cargoTypes.find((c) => c.id == cargo) || null;
        }

-        if (!vehicle) console.log('Brak pojazdu:', type);
+        if (!vehicle) console.log('Brak pojazdu / rodzaj pojazdu źle wczytany:', type);

        this.addVehicle(vehicle, vehicleCargo);
      });
@@ -1,5 +1,5 @@
-import { defineComponent } from "vue";
-import { useStore } from "../store";
+import { defineComponent } from 'vue';
+import { useStore } from '../store';

 export default defineComponent({
  setup() {
@@ -11,17 +11,11 @@ export default defineComponent({
  },
  computed: {
    trainTooLong() {
-      return (
-        (this.store.totalLength > 350 && this.store.isTrainPassenger) ||
-        (this.store.totalLength > 650 && !this.store.isTrainPassenger)
-      );
+      return (this.store.totalLength > 350 && this.store.isTrainPassenger) || (this.store.totalLength > 650 && !this.store.isTrainPassenger);
    },

    trainTooHeavy() {
-      return (
-        this.store.acceptableMass &&
-        this.store.totalMass > this.store.acceptableMass
-      );
+      return this.store.acceptableWeight && this.store.totalWeight > this.store.acceptableWeight;
    },

    locoNotSuitable() {
@@ -29,9 +23,7 @@ export default defineComponent({
        !this.store.isTrainPassenger &&
        this.store.stockList.length > 1 &&
        !this.store.stockList.every((stock) => stock.isLoco) &&
-        this.store.stockList.some(
-          (stock) => stock.isLoco && stock.type.startsWith("EP"),
-        )
+        this.store.stockList.some((stock) => stock.isLoco && stock.type.startsWith('EP'))
      );
    },

@@ -1,14 +1,14 @@
 import { IStockData, IStore } from './types';
 import { defineStore } from 'pinia';
 import {
-  acceptableMass,
+  acceptableMass as acceptableWeight,
  carDataList,
  chosenRealStock,
  isTrainPassenger,
  locoDataList,
  maxStockSpeed,
  totalLength,
-  totalMass,
+  totalWeight,
 } from './utils/vehicleUtils';
 import http from './http';

@@ -22,6 +22,7 @@ export const useStore = defineStore({
      chosenVehicle: null,

      isColdStart: false,
+      isDoubleManned: false,

      showSupporter: false,
      imageLoading: false,
@@ -55,12 +56,30 @@ export const useStore = defineStore({
    locoDataList: (state) => locoDataList(state),
    carDataList: (state) => carDataList(state),
    vehicleDataList: (state) => [...locoDataList(state), ...carDataList(state)],
-    totalMass: (state) => totalMass(state),
+    totalWeight: (state) => totalWeight(state),
    totalLength: (state) => totalLength(state),
    maxStockSpeed: (state) => maxStockSpeed(state),
    isTrainPassenger: (state) => isTrainPassenger(state),
    chosenRealStock: (state) => chosenRealStock(state),
-    acceptableMass: (state) => acceptableMass(state),
+    acceptableWeight: (state) => acceptableWeight(state),
+
+    stockSupportsColdStart: (state) => {
+      if (state.stockList.length == 0) return false;
+      if (!state.stockList[0].isLoco) return false;
+
+      const headingLoco = state.stockList[0];
+
+      return state.stockData?.props.find((stock) => stock.type == headingLoco.constructionType)?.coldStart ?? false;
+    },
+
+    stockSupportsDoubleManning: (state) => {
+      if (state.stockList.length == 0) return false;
+      if (!state.stockList[0].isLoco) return false;
+
+      const headingLoco = state.stockList[0];
+
+      return state.stockData?.props.find((stock) => stock.type == headingLoco.constructionType)?.doubleManned ?? false;
+    },
  },

  actions: {
@@ -3,34 +3,34 @@ $breakpointSm: 550px;

 $bgColor: #2b3552;
 $textColor: #fff;
-$secondaryColor: #222;
+$secondaryColor: #1b1b1b;
 $accentColor: #e4c428;

@font-face {
-  font-family: 'Lato';
+  font-family: "Lato";
  src:
-    url('$fonts/Lato-Light.woff2') format('woff2'),
-    url('$fonts/Lato-Light.woff') format('woff');
+    url("/fonts/Lato-Light.woff2") format("woff2"),
+    url("/fonts/Lato-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
 }

@font-face {
-  font-family: 'Lato';
+  font-family: "Lato";
  src:
-    url('$fonts/Lato-Bold.woff2') format('woff2'),
-    url('$fonts/Lato-Bold.woff') format('woff');
+    url("/fonts/Lato-Bold.woff2") format("woff2"),
+    url("/fonts/Lato-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
 }

@font-face {
-  font-family: 'Lato';
+  font-family: "Lato";
  src:
-    url('$fonts/Lato-Regular.woff2') format('woff2'),
-    url('$fonts/Lato-Regular.woff') format('woff');
+    url("/fonts/Lato-Regular.woff2") format("woff2"),
+    url("/fonts/Lato-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
@@ -118,7 +118,7 @@ button {
  padding: 0.4em 0.75em;

  outline: none;
-  background-color: #222;
+  background-color: $secondaryColor;
  border-radius: 8px;
  font-weight: bold;

@@ -141,14 +141,14 @@ button {
    outline: 1px solid white;
  }

-  &[data-chosen='true'] {
+  &[data-chosen="true"] {
    background-color: $accentColor;
    color: black;

    box-shadow: 0 0 5px 1px $accentColor;
  }

-  &[data-disabled='true'] {
+  &[data-disabled="true"] {
    user-select: none;
    pointer-events: none;
    -moz-user-select: none;
@@ -183,8 +183,8 @@ button {
 }

 select,
-input[type='text'],
-input[type='number'] {
+input[type="text"],
+input[type="number"] {
  background: $bgColor;
  border: 2px solid #aaa;
  outline: none;
@@ -227,6 +227,13 @@ ul {
  }
 }

+hr {
+  height: 3px;
+  background-color: white;
+  outline: none;
+  margin: 0;
+}
+
 .g-card {
  position: fixed;
  top: 1em;
@@ -8,12 +8,18 @@
    padding: 0.5em 1em;

    background-color: $secondaryColor;
+    text-align: center;

    h2 {
      margin: 0;
      color: white;
      font-size: 1.35em;
-      text-align: center;
+    }
+
+    h3 {
+      margin: 0.5em 0 0 0;
+      font-size: 1.15em;
+      color: #aaa;
    }

    button {
@@ -58,13 +64,6 @@
  }
 }

-hr {
-  height: 3px;
-  background-color: white;
-  outline: none;
-  margin: 0;
-}
-
@media only screen and (max-width: 470px) {
  .tab_attributes {
    label {
@@ -8,6 +8,7 @@ export interface IStore {
  chosenVehicle: Vehicle | null;

  isColdStart: boolean;
+  isDoubleManned: boolean;

  showSupporter: boolean;
  imageLoading: boolean;
@@ -40,8 +41,17 @@ export type TCarWagonGroup = 'car-passenger' | 'car-cargo';
 export interface IStockProps {
  type: string;
  length: number;
-  mass: number;
-  cargo: string;
+  // mass: number;
+  weight: number;
+  // cargo?: string | null;
+  cargoTypes: ICargo[] | null;
+  coldStart?: boolean;
+  doubleManned?: boolean;
+}
+
+export interface ICargo {
+  id: string;
+  weight: number;
 }

 export interface IStockData {
@@ -64,8 +74,6 @@ export interface IStockData {
  };

  props: IStockProps[];
-
-  usage: { [key: string]: string };
 }

 export interface ILocomotive {
@@ -78,9 +86,10 @@ export interface ILocomotive {
  isSponsorsOnly: boolean;
  sponsorsOnlyTimestamp: number;
  imageSrc: string;
-
-  mass: number;
+  weight: number;
  length: number;
+  coldStart: boolean;
+  doubleManned: boolean;
 }

 export interface ICarWagon {
@@ -93,15 +102,9 @@ export interface ICarWagon {
  sponsorsOnlyTimestamp: number;
  maxSpeed: number;
  imageSrc: string;
-
-  mass: number;
+  weight: number;
  length: number;
-  cargoList: { id: string; totalMass: number }[];
-}
-
-export interface ICargo {
-  id: string;
-  totalMass: number;
+  cargoTypes: ICargo[];
 }

 export interface IStock {
@@ -110,9 +113,10 @@ export interface IStock {
  useType: string;
  constructionType: string;
  length: number;
-  mass: number;
+  // mass: number;
+  weight: number;
  maxSpeed: number;
-  cargo?: { id: string; totalMass: number };
+  cargo?: ICargo;
  isLoco: boolean;
  isSponsorsOnly: boolean;
  sponsorsOnlyTimestamp: number;
@@ -1,7 +0,0 @@
-const supportedConstructions = ["303e", "203e"];
-
-export function locoSupportsColdStart(constructionType: string) {
-  return new RegExp(`(${supportedConstructions.join("|")})`).test(
-    constructionType,
-  );
-}
@@ -1,19 +0,0 @@
-import speedLimitTable from "../constants/speedLimits.json";
-export type LocoType = keyof typeof speedLimitTable;
-
-export const calculateSpeedLimit = (
-  locoType: LocoType,
-  stockMass: number,
-  isTrainPassenger: boolean,
-) => {
-  const speedTable =
-    speedLimitTable[locoType][isTrainPassenger ? "passenger" : "cargo"];
-
-  if (!speedTable) return undefined;
-
-  let speedLimit = 0;
-  for (const mass in speedTable)
-    if (stockMass > Number(mass)) speedLimit = (speedTable as any)[mass];
-
-  return speedLimit;
-};
@@ -0,0 +1,27 @@
+import speedLimits from '../constants/speedLimits.json';
+import massLimits from '../constants/massLimits.json';
+
+export type SpeedLimitLocoType = keyof typeof speedLimits;
+export type MassLimitLocoType = keyof typeof massLimits;
+
+export function calculateSpeedLimit(locoType: SpeedLimitLocoType, stockTotalWeight: number, stockCount: number, isTrainPassenger: boolean) {
+  if (speedLimits[locoType] === undefined) return 0;
+
+  if (stockCount == 1) return speedLimits[locoType]['none'];
+
+  const stockType = isTrainPassenger ? 'passenger' : 'cargo';
+  const speedTable = speedLimits[locoType][stockType];
+
+  if (!speedTable) return undefined;
+
+  let speedLimit = 0;
+  for (const mass in speedTable) if (stockTotalWeight > Number(mass)) speedLimit = (speedTable as any)[mass];
+
+  return speedLimit;
+}
+
+export function calculateMassLimit(locoType: MassLimitLocoType, isTrainPassenger: boolean) {
+  if (massLimits[locoType] === undefined) return 0;
+
+  return massLimits[locoType][isTrainPassenger ? 0 : 1] || 0;
+}
@@ -1,6 +1,6 @@
 import { EVehicleUseType } from '../enums/EVehicleUseType';
 import { ICarWagon, ILocomotive, IStore, TCarWagonGroup, TLocoGroup } from '../types';
-import { LocoType, calculateSpeedLimit } from './speedLimitUtils';
+import { MassLimitLocoType, SpeedLimitLocoType, calculateMassLimit, calculateSpeedLimit } from './vehicleLimitsUtils';

 export function isLocomotive(vehicle: ILocomotive | ICarWagon): vehicle is ILocomotive {
  return (vehicle as ILocomotive).power !== undefined;
@@ -33,8 +33,11 @@ export function locoDataList(state: IStore) {
        sponsorsOnlyTimestamp: Number(sponsorsTimestamp),
        imageSrc: '',

-        length: locoProps?.length && type.startsWith('2EN') ? locoProps.length * 2 : locoProps?.length || 0,
-        mass: locoProps?.mass && type.startsWith('2EN') ? 253 : locoProps?.mass || 0,
+        length: locoProps?.length && type.startsWith('2EN') ? locoProps.length * 2 : locoProps?.length ?? 0,
+        weight: locoProps?.weight && type.startsWith('2EN') ? 253000 : locoProps?.weight ?? 0,
+
+        coldStart: locoProps?.coldStart ?? false,
+        doubleManned: locoProps?.doubleManned ?? false,
      });
    });

@@ -69,15 +72,9 @@ export function carDataList(state: IStore) {
        sponsorsOnlyTimestamp: Number(sponsorsOnlyTimestamp),
        maxSpeed: Number(maxSpeed),
        imageSrc: '',
-        cargoList:
-          !carPropsData || carPropsData.cargo === null
-            ? []
-            : carPropsData.cargo.split(';').map((cargo) => ({
-                id: cargo.split(':')[0],
-                totalMass: Number(cargo.split(':')[1]),
-              })),
+        cargoTypes: carPropsData?.cargoTypes ?? [],

-        mass: carPropsData?.mass || 0,
+        weight: carPropsData?.weight || 0,
        length: carPropsData?.length || 0,
      });
    });
@@ -86,8 +83,8 @@ export function carDataList(state: IStore) {
  }, [] as ICarWagon[]);
 }

-export function totalMass(state: IStore) {
-  return ~~state.stockList.reduce((acc, stock) => acc + (stock.cargo ? stock.cargo.totalMass : stock.mass) * stock.count, 0);
+export function totalWeight(state: IStore) {
+  return state.stockList.reduce((acc, stock) => acc + (stock.weight + (stock.cargo?.weight ?? 0)) * stock.count, 0);
 }

 export function totalLength(state: IStore) {
@@ -104,35 +101,19 @@ export function maxStockSpeed(state: IStore) {

  if (/^(EN|2EN|SN)/.test(locoType)) return stockSpeedLimit;

-  const stockMass = totalMass(state);
-
-  const speedLimitByMass = calculateSpeedLimit(locoType as LocoType, stockMass, isTrainPassenger(state));
+  const speedLimitByMass = calculateSpeedLimit(locoType as SpeedLimitLocoType, totalWeight(state), state.stockList.length, isTrainPassenger(state));

  return speedLimitByMass ? Math.min(stockSpeedLimit, speedLimitByMass) : stockSpeedLimit;
 }

 export function acceptableMass(state: IStore) {
  if (state.stockList.length == 0 || !state.stockList[0].isLoco) return 0;
-  const activeLocomotiveType = state.stockList[0].type;

-  if (/^SM/.test(activeLocomotiveType)) return 2400;
+  const activeLocomotiveType = state.stockList[0].type.split('-')[0];

-  // Elektryczne EU07 / EP07 / EP08 / ET41
+  const locoMassLimit = calculateMassLimit(activeLocomotiveType as MassLimitLocoType, isTrainPassenger(state));

-  // Pasażerski elektr.
-  if (isTrainPassenger(state)) {
-    if (/^(EU|EP)/.test(activeLocomotiveType)) return 650;
-    if (/^ET/.test(activeLocomotiveType)) return 700;
-
-    return 0;
-  }
-
-  // Towarowy / inny elektr.
-  if (/^EU/.test(activeLocomotiveType)) return 2000;
-  if (/^ET/.test(activeLocomotiveType)) return 4000;
-  if (/^EP/.test(activeLocomotiveType)) return 650;
-
-  return 0;
+  return locoMassLimit;
 }

 export function isTrainPassenger(state: IStore) {
@@ -26,10 +26,12 @@ export default defineComponent({

 <style lang="scss" scoped>
 .app-container {
-  min-height: 100vh;
-
  display: flex;
-  flex-direction: column;
+  justify-content: center;
  align-items: center;
+  flex-direction: column;
+
+  min-height: 100vh;
+  padding: 0.5em;
 }
 </style>
@@ -2,31 +2,29 @@ import { defineConfig } from 'vite';
 import vue from '@vitejs/plugin-vue';

 import { VitePWA } from 'vite-plugin-pwa';
-import { resolve } from 'path';

 // https://vitejs.dev/config/
 export default defineConfig({
  server: {
    port: 2137,
  },
-  resolve: {
-    alias: {
-      $fonts: resolve('/fonts'),
-      $images: resolve('/images'),
-    },
-  },
  plugins: [
    vue(),
    VitePWA({
      registerType: 'autoUpdate',

+      devOptions: {
+        suppressWarnings: true,
+        enabled: true,
+      },
+
      workbox: {
-        globPatterns: ['**/*.{js,css,html,png,svg,img,woff,woff2}'],
+        globPatterns: ['**/*.{js,css,html,jpg,png,svg,img,woff,woff2}'],

        runtimeCaching: [
          {
            urlPattern: /^https:\/\/rj.td2.info.pl\/dist\/img\/thumbnails\/.*/i,
-            handler: 'CacheFirst',
+            handler: 'NetworkFirst',
            options: {
              cacheName: 'swdr-images-cache',
              expiration: {
@@ -40,10 +38,11 @@ export default defineConfig({
          },
          {
            urlPattern: /^https:\/\/spythere.github.io\/api\/td2\/.*/i,
-            handler: 'CacheFirst',
+            handler: 'NetworkFirst',
            options: {
              cacheName: 'spythere-api-cache',
              expiration: {
+                maxEntries: 150,
                maxAgeSeconds: 60 * 60 * 24, // <== 1 day
              },
              cacheableResponse: {
Author	SHA1	Message	Date
Spythere	ed0906b63e	Merge pull request #20 from Spythere/development Wersja 1.8.1	2024-03-07 14:22:45 +01:00
Spythere	2ae19123a3	bump: 1.8.1	2024-03-07 14:19:23 +01:00
Spythere	0c2be7b927	speed limits fix	2024-03-07 14:19:04 +01:00
Spythere	ffce2b572b	Wersja 1.7.4 Wersja 1.7.4	2024-02-20 13:26:22 +01:00
Spythere	1b5a26e380	speed constraints for locomotives-only	2024-02-20 12:14:09 +01:00
Spythere	c9b681eaee	bump: 1.8.0	2024-02-20 11:49:52 +01:00
Spythere	160879adec	hotfix	2024-02-19 21:25:21 +01:00
Spythere	d6ddbe7af7	translation fixes	2024-02-19 17:42:41 +01:00
Spythere	1c7b72ea1d	removed new categories; awaiting changes in the simulator	2024-02-19 17:41:16 +01:00
Spythere	83f5b07c7e	code adaptation for API changes; tons changed to kilos	2024-02-19 17:37:46 +01:00
Spythere	77cb64e25a	num. generator: categories update	2024-02-15 23:09:21 +01:00
Spythere	6d0cc8e7cd	wiki tab td padding	2024-02-14 15:06:45 +01:00
Spythere	7fb4b0ae26	fix: incorrect wagon count while generating a r.stock	2024-02-14 15:04:23 +01:00
Spythere	ed191d597b	translations; numgen category drawing	2024-02-05 22:36:36 +01:00
Spythere	5d24accb15	forum link update	2024-02-03 18:19:43 +01:00
Spythere	54c6850121	translation & num gen fixes	2024-02-03 18:17:01 +01:00
Spythere	fad8c40b4b	translation fixes	2024-02-03 16:41:07 +01:00
Spythere	a8485b3531	lock sync hotfix	2024-02-03 16:31:04 +01:00
Spythere	e7dcd125ec	packages upgrade	2024-02-03 16:26:42 +01:00
Spythere	d886f44c59	lock files	2024-02-03 16:18:13 +01:00
Spythere	5ff6c0504e	bump to 1.7.4; added new categories to number gen & showing rules	2024-02-03 16:15:22 +01:00
Spythere	2158145ae8	design update & fixes	2024-02-01 16:12:41 +01:00
Spythere	6101c9bfb2	grouping generated stock (wip)	2024-01-30 16:39:16 +01:00
Spythere	bd9af9a630	Merge pull request #18 from Spythere/development Wersja 1.7.3	2024-01-18 17:57:01 +01:00
Spythere	2188dbdf9b	bump: 1.7.3	2024-01-18 16:37:15 +01:00
Spythere	c4576d7802	hotfix 4E	2024-01-18 16:36:57 +01:00
Spythere	86cb4cff4d	Merge pull request #17 - Wersja 1.7.2 Wersja 1.7.2	2023-11-07 17:43:34 +01:00
Spythere	0534848677	bump: 1.7.2	2023-11-06 21:20:22 +01:00
Spythere	c5d116e2db	added alphabetical cargo sort	2023-11-06 21:20:07 +01:00
Spythere	3dce5ec7c0	responsive font size	2023-11-06 21:08:01 +01:00
Spythere	956ff8afd7	stock thumbnail labels fix	2023-11-06 20:20:00 +01:00
Spythere	5b629833df	Merge pull request #16 - Wersja 1.7.1 Wersja 1.7.1	2023-10-31 23:05:43 +01:00
Spythere	b53201a7ff	hotfix	2023-10-31 23:02:58 +01:00
Spythere	f0ddd0e27f	custom checkboxes	2023-10-31 03:17:24 +01:00
Spythere	94bfba2c49	resolve fonts edit	2023-10-31 03:17:11 +01:00
Spythere	1e4541ef0d	spawn props checking on stock upload	2023-10-28 15:40:22 +02:00
Spythere	c25a55a7d9	added double manning checkbox & support	2023-10-28 15:33:09 +02:00
Spythere	bea3c59405	thumbnail placeholder fix	2023-10-28 14:12:21 +02:00
Spythere	8cd43adff3	acceptable masses & speeds update	2023-10-28 13:44:55 +02:00
Spythere	5ab1963117	lock files sync	2023-10-27 16:46:57 +02:00
Spythere	50d784a0de	1.7.1 bump	2023-10-27 16:43:39 +02:00
Spythere	f61135ce6b	packages bump; config	2023-10-27 16:39:54 +02:00
Spythere	5e43ece1aa	pwa optimize & fixes	2023-10-27 16:36:25 +02:00