From cbe983f96c6f503cfee0b97aaecf0c0b2957ac80 Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Thu, 13 Jul 2023 17:51:09 +0200
Subject: [PATCH] support zimnego startu lokomotyw

---
 src/components/sections/InputsSection.vue | 20 +------
 src/components/sections/StockSection.vue  |  4 +-
 src/components/tabs/StockListTab.vue      | 59 +++++++++---------
 src/components/tabs/WikiListTab.vue       | 73 ++++++++++++++++-------
 src/components/utils/StockThumbnails.vue  |  3 -
 src/mixins/stockMixin.ts                  |  5 +-
 src/mixins/warningsMixin.ts               |  2 +-
 src/store.ts                              |  6 ++
 src/styles/global.scss                    |  6 +-
 src/types.ts                              |  6 +-
 src/utils/locoUtils.ts                    |  5 ++
 11 files changed, 108 insertions(+), 81 deletions(-)
 create mode 100644 src/utils/locoUtils.ts

diff --git a/src/components/sections/InputsSection.vue b/src/components/sections/InputsSection.vue
index 7aac727..1ffcf91 100644
--- a/src/components/sections/InputsSection.vue
+++ b/src/components/sections/InputsSection.vue
@@ -107,10 +107,8 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 
-import { IStock } from '../../types';
 import imageMixin from '../../mixins/imageMixin';
 import { useStore } from '../../store';
-import { isLocomotive } from '../../utils/vehicleUtils';
 import stockPreviewMixin from '../../mixins/stockPreviewMixin';
 import stockMixin from '../../mixins/stockMixin';
 
@@ -197,22 +195,8 @@ export default defineComponent({
 
       if (!vehicle) return;
 
-      const stockObj: IStock = {
-        id: `${Date.now()}`,
-        useType: isLocomotive(vehicle) ? vehicle.power : vehicle.useType,
-        type: vehicle.type,
-        length: vehicle.length,
-        mass: vehicle.mass,
-        maxSpeed: vehicle.maxSpeed,
-        isLoco: isLocomotive(vehicle),
-        cargo:
-          !isLocomotive(vehicle) && vehicle.loadable && this.store.chosenCargo ? this.store.chosenCargo : undefined,
-        count: 1,
-        imgSrc: vehicle.imageSrc,
-        supportersOnly: vehicle.supportersOnly,
-      };
-
-      this.store.stockList[this.store.chosenStockListIndex] = stockObj;
+      const stockObject = this.getStockObject(vehicle, this.store.chosenCargo);
+      this.store.stockList[this.store.chosenStockListIndex] = stockObject;
     },
   },
 });
diff --git a/src/components/sections/StockSection.vue b/src/components/sections/StockSection.vue
index 3563493..769d3cd 100644
--- a/src/components/sections/StockSection.vue
+++ b/src/components/sections/StockSection.vue
@@ -49,12 +49,10 @@ const sectionKeyIndexes: { [key: number]: SectionMode } = {
 };
 
 onMounted(() => {
-  console.log(sectionButtonRefs.value);
-
   window.addEventListener('keydown', (e) => {
     if (e.target instanceof HTMLInputElement) return;
 
-    if (e.key == '1' || e.key == '2' || e.key == '3' || e.key == '4') {
+    if (/[1234]/.test(e.key)) {
       const keyNum = Number(e.key);
       store.stockSectionMode = sectionKeyIndexes[keyNum];
       (sectionButtonRefs.value[keyNum - 1] as HTMLButtonElement).focus();
diff --git a/src/components/tabs/StockListTab.vue b/src/components/tabs/StockListTab.vue
index 06e14c9..dbf5855 100644
--- a/src/components/tabs/StockListTab.vue
+++ b/src/components/tabs/StockListTab.vue
@@ -1,5 +1,5 @@
 <template>
-  <section class="stock-list">
+  <section class="stock-list-tab">
     <div class="stock_controls" :data-disabled="store.chosenStockListIndex == -1">
       <b class="no">
         POJAZD NR <span class="text--accent">{{ store.chosenStockListIndex + 1 }}</span> &nbsp;
@@ -68,7 +68,18 @@
       </span>
     </div>
 
-    <div class="stock_warnings">
+    <div class="stock_cold-start">
+      <label>
+        <input
+          type="checkbox"
+          v-model="store.isColdStart"
+          :disabled="!locoSupportsColdStart(store.stockList[0]?.constructionType || '')"
+        />
+        Zimny start lokomotywy czołowej (tylko elektrowozy typów 303E i 203E)
+      </label>
+    </div>
+
+    <div class="stock_warnings" v-if="stockHasWarnings">
       <div class="warning" v-if="locoNotSuitable">
         Lokomotywy EP07 i EP08 są przeznaczone jedynie do ruchu pasażerskiego!
       </div>
@@ -147,10 +158,11 @@ import { defineComponent } from 'vue';
 import TrainImage from '../sections/TrainImageSection.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 { IStock } from '../../types';
 import StockThumbnails from '../utils/StockThumbnails.vue';
 import stockMixin from '../../mixins/stockMixin';
 
@@ -162,8 +174,7 @@ export default defineComponent({
 
   setup() {
     const store = useStore();
-    
-    
+
     return {
       store,
     };
@@ -178,13 +189,12 @@ export default defineComponent({
   computed: {
     stockString() {
       return this.store.stockList
-        .map((stock) => {
-          let s = stock.isLoco || !stock.cargo ? stock.type : `${stock.type}:${stock.cargo.id}`;
+        .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' : '';
 
-          let final = s;
-          for (let i = 0; i < stock.count - 1; i++) final += `;${s}`;
-
-          return final;
+          return stockTypeStr + coldStart;
         })
         .join(';');
     },
@@ -196,19 +206,16 @@ export default defineComponent({
     chosenStockVehicle() {
       return this.store.chosenStockListIndex == -1 ? undefined : this.store.stockList[this.store.chosenStockListIndex];
     },
-  },
 
-  methods: {
     stockHasWarnings() {
       return this.tooManyLocomotives || this.trainTooHeavy || this.trainTooLong || this.locoNotSuitable;
     },
+  },
+
+  methods: {
+    locoSupportsColdStart,
 
     copyToClipboard() {
-      // if (this.stockHasWarnings()) {
-      //   alert('Jazda tym pociągiem jest niezgodna z regulaminem symulatora! Zmień parametry zestawienia!');
-      //   return;
-      // }
-
       navigator.clipboard.writeText(this.stockString);
 
       setTimeout(() => {
@@ -317,9 +324,6 @@ export default defineComponent({
     downloadStock() {
       if (this.store.stockList.length == 0) return alert('Lista pojazdów jest pusta!');
 
-      // if (this.stockHasWarnings())
-      //   return alert('Jazda tym pociągiem jest niezgodna z regulaminem symulatora! Zmień parametry zestawienia!');
-
       const defaultName = `${this.store.chosenRealStockName || this.store.stockList[0].type} ${
         this.store.totalMass
       }t; ${this.store.totalLength}m; vmax ${this.store.maxStockSpeed}`;
@@ -395,6 +399,11 @@ export default defineComponent({
 <style lang="scss" scoped>
 @import '../../styles/global';
 
+.stock-list-tab {
+  display: grid;
+  grid-gap: 0.5em;
+}
+
 .warning {
   padding: 0.25em;
   background: $accentColor;
@@ -417,7 +426,6 @@ export default defineComponent({
   flex-wrap: wrap;
 
   padding: 0.5em;
-  margin-bottom: 1em;
 
   background-color: #353a57;
 
@@ -450,7 +458,6 @@ export default defineComponent({
 .stock_actions {
   display: grid;
   gap: 0.5em;
-  margin-bottom: 1em;
 
   grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
 
@@ -472,9 +479,7 @@ export default defineComponent({
 
 ul {
   position: relative;
-
   overflow: auto;
-
   height: 500px;
 }
 
@@ -518,10 +523,6 @@ li > .stock-info {
   }
 }
 
-.stock_warnings {
-  margin: 0.5em 0;
-}
-
 .supporter {
   color: salmon;
 }
diff --git a/src/components/tabs/WikiListTab.vue b/src/components/tabs/WikiListTab.vue
index 5c800e8..a67a735 100644
--- a/src/components/tabs/WikiListTab.vue
+++ b/src/components/tabs/WikiListTab.vue
@@ -15,7 +15,7 @@
       <table>
         <thead>
           <tr>
-            <th v-for="header in wikiMode == 'locomotives' ? locoHeaders : carHeaders" @click="toggleSorter(header.id)">
+            <th v-for="header in wikiMode == 'locomotives' ? locoHeaders : carHeaders" @click="toggleSorter(header)">
               {{ header.name }}
 
               <span v-if="currentModeSorter.id == header.id">
@@ -44,6 +44,7 @@
             <td>{{ loco.type }}</td>
             <td>{{ vehicleTypes[loco.power] }}</td>
             <td>{{ loco.constructionType }}</td>
+            <td>{{ locoSupportsColdStart(loco.constructionType) ? `&check;` : '&cross;' }}</td>
             <td>{{ loco.length }}m</td>
             <td>{{ loco.mass }}t</td>
             <td>{{ loco.maxSpeed }}km/h</td>
@@ -86,28 +87,45 @@ import stockPreviewMixin from '../../mixins/stockPreviewMixin';
 import { Vehicle } from '../../types';
 import { isLocomotive } from '../../utils/vehicleUtils';
 import stockMixin from '../../mixins/stockMixin';
+import { locoSupportsColdStart } from '../../utils/locoUtils';
 
 type WikiMode = 'locomotives' | 'carWagons';
-type SorterID = 'type' | 'constructionType' | 'image' | 'length' | 'mass' | 'maxSpeed' | 'cargoCount' | 'power';
+type SorterID =
+  | 'type'
+  | 'constructionType'
+  | 'image'
+  | 'length'
+  | 'mass'
+  | 'maxSpeed'
+  | 'cargoCount'
+  | 'power'
+  | 'coldStart';
 
-const locoHeaders: { name: string; id: SorterID }[] = [
-  { name: 'Zdjęcie', id: 'image' },
-  { name: 'Nazwa', id: 'type' },
-  { name: 'Rodzaj', id: 'power' },
-  { name: 'Konstrukcja', id: 'constructionType' },
-  { name: 'Długość', id: 'length' },
-  { name: 'Masa', id: 'mass' },
-  { name: 'Prędkość', id: 'maxSpeed' },
+interface WikiHeader {
+  name: string;
+  id: SorterID;
+  sortable: boolean;
+}
+
+const locoHeaders: WikiHeader[] = [
+  { name: 'Zdjęcie', id: 'image', sortable: false },
+  { name: 'Nazwa', id: 'type', sortable: true },
+  { name: 'Rodzaj', id: 'power', sortable: true },
+  { name: 'Konstrukcja', id: 'constructionType', sortable: true },
+  { name: 'Zimny start', id: 'coldStart', sortable: true },
+  { name: 'Długość', id: 'length', sortable: true },
+  { name: 'Masa', id: 'mass', sortable: true },
+  { name: 'Prędkość', id: 'maxSpeed', sortable: true },
 ];
 
-const carHeaders: { name: string; id: SorterID }[] = [
-  { name: 'Zdjęcie', id: 'image' },
-  { name: 'Nazwa', id: 'type' },
-  { name: 'Konstrukcja', id: 'constructionType' },
-  { name: 'Długość', id: 'length' },
-  { name: 'Masa', id: 'mass' },
-  { name: 'Prędkość', id: 'maxSpeed' },
-  { name: 'Ładunki', id: 'cargoCount' },
+const carHeaders: WikiHeader[] = [
+  { name: 'Zdjęcie', id: 'image', sortable: false },
+  { name: 'Nazwa', id: 'type', sortable: true },
+  { name: 'Konstrukcja', id: 'constructionType', sortable: true },
+  { name: 'Długość', id: 'length', sortable: true },
+  { name: 'Masa', id: 'mass', sortable: true },
+  { name: 'Prędkość', id: 'maxSpeed', sortable: true },
+  { name: 'Ładunki', id: 'cargoCount', sortable: true },
 ];
 
 const vehicleTypes: { [key: string]: string } = {
@@ -151,6 +169,8 @@ export default defineComponent({
   },
 
   methods: {
+    locoSupportsColdStart,
+
     scrollEvent(e: Event) {
       const tableScrollTop = (e.target as HTMLElement).scrollTop;
 
@@ -163,14 +183,16 @@ export default defineComponent({
       this.wikiMode = wikiMode;
     },
 
-    toggleSorter(id: SorterID) {
-      if (id == this.currentModeSorter.id) this.currentModeSorter.direction = -this.currentModeSorter.direction;
-      this.currentModeSorter.id = id;
+    toggleSorter(header: WikiHeader) {
+      if (!header.sortable) return;
+
+      if (header.id == this.currentModeSorter.id) this.currentModeSorter.direction *= -1;
+      this.currentModeSorter.id = header.id;
     },
 
     sortVehicles(vA: Vehicle, vB: Vehicle) {
       const { id, direction } = this.currentModeSorter;
-      // const vehiclesAreLocos = isLocomotive(vA) && isLocomotive(vB);
+      const vehiclesAreLocos = isLocomotive(vA) && isLocomotive(vB);
       const vehiclesAreCars = !isLocomotive(vA) && !isLocomotive(vB);
 
       switch (id) {
@@ -186,6 +208,13 @@ export default defineComponent({
         case 'cargoCount':
           if (vehiclesAreCars) return Math.sign((vA.cargoList.length || -1) - (vB.cargoList.length || -1)) * direction;
 
+        case 'coldStart':
+          if (vehiclesAreLocos)
+            return (
+              (locoSupportsColdStart(vA.constructionType) > locoSupportsColdStart(vB.constructionType) ? 1 : -1) *
+              direction
+            );
+
         default:
           break;
       }
diff --git a/src/components/utils/StockThumbnails.vue b/src/components/utils/StockThumbnails.vue
index 99d086d..cce0473 100644
--- a/src/components/utils/StockThumbnails.vue
+++ b/src/components/utils/StockThumbnails.vue
@@ -86,10 +86,7 @@ const allowDrop = (e: DragEvent) => {
 <style lang="scss" scoped>
 .stock_thumbnails {
   display: flex;
-  margin: 1em 0;
-
   overflow: auto;
-
   background-color: #353a57;
 
   > div {
diff --git a/src/mixins/stockMixin.ts b/src/mixins/stockMixin.ts
index 5b5565c..bcd08d9 100644
--- a/src/mixins/stockMixin.ts
+++ b/src/mixins/stockMixin.ts
@@ -30,6 +30,7 @@ export default defineComponent({
         imgSrc: vehicle.imageSrc,
         useType: isLoco ? vehicle.power : vehicle.useType,
         supportersOnly: vehicle.supportersOnly,
+        constructionType: vehicle.constructionType,
       };
     },
 
@@ -67,13 +68,15 @@ export default defineComponent({
 
       this.store.swapVehicles = false;
 
-      stockArray.forEach((type) => {
+      stockArray.forEach((type, i) => {
         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(',');
           vehicle = this.store.locoDataList.find((loco) => loco.type == locoType) || null;
+
+          if (i == 0 && coldStart == 'c') this.store.isColdStart = true;
         } else {
           const [carType, cargo] = type.split(':');
           vehicle = this.store.carDataList.find((car) => car.type == carType) || null;
diff --git a/src/mixins/warningsMixin.ts b/src/mixins/warningsMixin.ts
index 0515d62..2c7095c 100644
--- a/src/mixins/warningsMixin.ts
+++ b/src/mixins/warningsMixin.ts
@@ -26,7 +26,7 @@ export default defineComponent({
         !this.store.isTrainPassenger &&
         this.store.stockList.length > 1 &&
         !this.store.stockList.every((stock) => stock.isLoco) &&
-        this.store.stockList.find((stock) => stock.isLoco && stock.type.startsWith('EP'))
+        this.store.stockList.some((stock) => stock.isLoco && stock.type.startsWith('EP'))
       );
     },
 
diff --git a/src/store.ts b/src/store.ts
index 33aa5b0..4922079 100644
--- a/src/store.ts
+++ b/src/store.ts
@@ -20,6 +20,8 @@ export const useStore = defineStore({
       chosenCargo: null,
       chosenVehicle: null,
 
+      isColdStart: false,
+
       showSupporter: false,
       imageLoading: false,
 
@@ -71,6 +73,9 @@ export const useStore = defineStore({
         case '/stockgnr':
           this.stockSectionMode = 'stock-generator';
           break;
+        case '/vehicles':
+          this.stockSectionMode = 'wiki-list';
+          break;
         default:
           break;
       }
@@ -78,3 +83,4 @@ export const useStore = defineStore({
   },
 });
 
+
diff --git a/src/styles/global.scss b/src/styles/global.scss
index ec188e0..50bde83 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -134,8 +134,9 @@ button {
 }
 
 select,
-input {
-  background: $bgColor;
+input[type="text"],
+input[type="number"] {
+  background: none;
   border: 2px solid #aaa;
   outline: none;
 
@@ -158,6 +159,7 @@ input {
 option {
   color: white;
   border: none;
+  background-color: $bgColor;
 }
 
 ul {
diff --git a/src/types.ts b/src/types.ts
index d1bad05..cea5c0c 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -5,9 +5,10 @@ export interface IStore {
   chosenCar: ICarWagon | null;
   chosenLoco: ILocomotive | null;
   chosenCargo: ICargo | null;
-
   chosenVehicle: Vehicle | null;
 
+  isColdStart: boolean;
+
   showSupporter: boolean;
   imageLoading: boolean;
 
@@ -99,8 +100,9 @@ export interface ICargo {
 
 export interface IStock {
   id: string;
-  useType: string;
   type: string;
+  useType: string;
+  constructionType: string;
   length: number;
   mass: number;
   maxSpeed: number;
diff --git a/src/utils/locoUtils.ts b/src/utils/locoUtils.ts
new file mode 100644
index 0000000..6a7f553
--- /dev/null
+++ b/src/utils/locoUtils.ts
@@ -0,0 +1,5 @@
+const supportedConstructions = ['303e', '203e'];
+
+export function locoSupportsColdStart(constructionType: string) {
+  return new RegExp(`(${supportedConstructions.join('|')})`).test(constructionType);
+}