diff --git a/package.json b/package.json index 84ba1cf..93d28b9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "stacjownik", - "version": "1.24.2", + "version": "1.24.3", "private": true, "scripts": { "dev": "vite", diff --git a/src/App.vue b/src/App.vue index a2c9683..36cf3e5 100644 --- a/src/App.vue +++ b/src/App.vue @@ -210,7 +210,7 @@ export default defineComponent({ overflow-x: hidden; @include smallScreen() { - font-size: calc(0.65rem + 0.8vw); + font-size: calc(0.65rem + 0.85vw); } @include screenLandscape() { diff --git a/src/components/Global/Card.vue b/src/components/Global/Card.vue index 06e9eed..25fff68 100644 --- a/src/components/Global/Card.vue +++ b/src/components/Global/Card.vue @@ -2,10 +2,9 @@
-
+
-
@@ -52,8 +51,12 @@ export default defineComponent({ left: 0; width: 100%; - height: 100vh; + height: 100%; z-index: 200; + + display: flex; + justify-content: center; + align-items: center; } .card-background { @@ -69,19 +72,22 @@ export default defineComponent({ } .card-body { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - z-index: 210; - overflow: auto; - max-height: 95vh; + position: relative; + margin: 1em; + + max-height: 95vh; + max-height: 95dvh; + + background-color: #1a1a1a; box-shadow: 0 0 15px 10px #0e0e0e; - & > :slotted(div) { - background-color: #1a1a1a; - width: 95vw; + overflow: auto; +} + +@include smallScreen { + .card { + align-items: flex-start; } } diff --git a/src/components/JournalView/JournalTimetables/TimetableGeneral.vue b/src/components/JournalView/JournalTimetables/TimetableGeneral.vue index ed12ae9..a8c6d45 100644 --- a/src/components/JournalView/JournalTimetables/TimetableGeneral.vue +++ b/src/components/JournalView/JournalTimetables/TimetableGeneral.vue @@ -103,7 +103,7 @@ export default defineComponent({ showTimetable(timetable: API.TimetableHistory.Data, target: EventTarget | null) { if (timetable?.terminated) return; - this.selectModalTrain(timetable.driverName + timetable.trainNo.toString(), target); + this.selectModalTrainById(`${timetable.driverName}${timetable.trainNo}`, target); } } }); diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue index 3f2ab4d..d9d06ad 100644 --- a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue +++ b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue @@ -18,8 +18,8 @@ tabindex="0" :key="train.id" :data-status="status" - @click.prevent="selectModalTrain(train.id, $event.currentTarget)" - @keydown.enter="selectModalTrain(train.id, $event.currentTarget)" + @click.prevent="selectModalTrain(train, $event.currentTarget)" + @keydown.enter="selectModalTrain(train, $event.currentTarget)" > {{ train.trainNo }} {{ train.driverName }} diff --git a/src/components/SceneryView/SceneryTimetable.vue b/src/components/SceneryView/SceneryTimetable.vue index c6d0788..c18dcd5 100644 --- a/src/components/SceneryView/SceneryTimetable.vue +++ b/src/components/SceneryView/SceneryTimetable.vue @@ -39,8 +39,8 @@
@@ -65,11 +65,11 @@
@@ -236,8 +236,6 @@ export default defineComponent({ if (!this.station) return []; if (!this.onlineScenery) return []; - console.log(this.onlineScenery.scheduledTrains, this.chosenCheckpoint); - return this.onlineScenery.scheduledTrains .filter( (ct) => diff --git a/src/components/StationsView/StationFilterCard.vue b/src/components/StationsView/StationFilterCard.vue index 2a6d822..00663cb 100644 --- a/src/components/StationsView/StationFilterCard.vue +++ b/src/components/StationsView/StationFilterCard.vue @@ -33,12 +33,13 @@
{{ $t('filters.title') }}

-
- {{ $t('filters.changed-filters-count') }} {{ changedFilters.length }} +
+ +
-
{{ $t('filters.no-changed-filters') }}
-
train.id == this.store.chosenModalTrainId); + return this.store.trainList.find((train) => train.modalId == this.store.chosenModalTrainId); } }, @@ -29,8 +29,15 @@ export default defineComponent({ chosenTrain(train: Train | undefined) { this.$nextTick(() => { if (train) { + document.body.classList.add('no-scroll'); const contentEl = this.$refs['content'] as HTMLElement; contentEl.focus(); + } else { + (this.store.modalLastClickedTarget as any)?.focus(); + + setTimeout(() => { + document.body.classList.remove('no-scroll'); + }, 90); } }); } @@ -47,12 +54,14 @@ export default defineComponent({ left: 0; width: 100%; + height: 100%; color: white; z-index: 200; display: flex; justify-content: center; + align-items: flex-start; text-align: left; } @@ -73,10 +82,10 @@ export default defineComponent({ position: relative; overflow-y: scroll; - margin-top: 1em; - width: 95vw; max-height: 95vh; + max-height: 95dvh; + margin-top: 1em; background-color: #1a1a1a; box-shadow: 0 0 15px 10px #0e0e0e; @@ -91,10 +100,4 @@ export default defineComponent({ } } } - -@include smallScreen { - .modal_content { - max-height: 85vh; - } -} diff --git a/src/components/TrainsView/TrainTable.vue b/src/components/TrainsView/TrainTable.vue index 03ea588..20d18e6 100644 --- a/src/components/TrainsView/TrainTable.vue +++ b/src/components/TrainsView/TrainTable.vue @@ -18,8 +18,8 @@ v-for="train in trains" :key="train.id" tabindex="0" - @click.stop="selectModalTrain(train.id, $event.currentTarget)" - @keydown.enter="selectModalTrain(train.id, $event.currentTarget)" + @click.stop="selectModalTrain(train, $event.currentTarget)" + @keydown.enter="selectModalTrain(train, $event.currentTarget)" > @@ -77,17 +77,6 @@ export default defineComponent({ return Status.Data.Loaded; } - }, - - activated() { - const query = this.$route.query; - if (query.trainNo && query.driverName) { - this.searchedDriver = query.driverName.toString(); - this.searchedTrain = query.trainNo.toString(); - setTimeout(() => { - this.selectModalTrain(query.driverName! + query.trainNo!.toString()); - }, 20); - } } }); diff --git a/src/locales/en.json b/src/locales/en.json index 2e3d8eb..465e467 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -112,8 +112,8 @@ "filters": "FILTERS", "donate": "DONATE", - "search-button": "Search", - "reset-button": "Reset", + "search-button": "SEARCH", + "reset-button": "RESET", "sort-title": "SORT BY:", "filter-title": "FILTER BY:", diff --git a/src/mixins/modalTrainMixin.ts b/src/mixins/modalTrainMixin.ts index 5c80dc3..390fdea 100644 --- a/src/mixins/modalTrainMixin.ts +++ b/src/mixins/modalTrainMixin.ts @@ -1,6 +1,7 @@ import { defineComponent } from 'vue'; import { useMainStore } from '../store/mainStore'; import { useTooltipStore } from '../store/tooltipStore'; +import { Train } from '../typings/common'; export default defineComponent({ data() { @@ -11,20 +12,19 @@ export default defineComponent({ }, methods: { - selectModalTrain(trainId: string, target?: EventTarget | null) { - this.store.chosenModalTrainId = trainId; - document.body.classList.add('no-scroll'); + selectModalTrain(train: Train, target?: EventTarget | null) { + this.store.chosenModalTrainId = train.modalId; + if (target) this.store.modalLastClickedTarget = target; + }, + + selectModalTrainById(modalId: string, target?: EventTarget | null) { + this.store.chosenModalTrainId = modalId; if (target) this.store.modalLastClickedTarget = target; }, closeModal() { this.store.chosenModalTrainId = undefined; this.tooltipStore.hide(); - - setTimeout(() => { - (this.store.modalLastClickedTarget as any)?.focus(); - document.body.classList.remove('no-scroll'); - }, 150); } } }); diff --git a/src/store/apiStore.ts b/src/store/apiStore.ts index 17e49ef..990dd53 100644 --- a/src/store/apiStore.ts +++ b/src/store/apiStore.ts @@ -60,8 +60,6 @@ export const useApiStore = defineStore('apiStore', { if (!this.activeData) this.dataStatuses.connection = Status.Data.Loading; try { - console.log('Fetching active data at ' + new Date().toLocaleTimeString('pl-PL')); - const response = await this.client!.get('api/getActiveData'); this.activeData = response.data; diff --git a/src/store/mainStore.ts b/src/store/mainStore.ts index 1ac3b12..6db5296 100644 --- a/src/store/mainStore.ts +++ b/src/store/mainStore.ts @@ -36,17 +36,13 @@ export const useMainStore = defineStore('mainStore', { }) as MainStoreState, getters: { - checkpointsTrains() { - return checkpointsTrains; - }, - trainList(): Train[] { const apiStore = useApiStore(); checkpointsTrains.clear(); sceneriesTrains.clear(); - const x = (apiStore.activeData?.trains ?? []) + return (apiStore.activeData?.trains ?? []) .filter((train) => train.timetable || train.online) .map((train) => { const stock = train.stockString.split(';'); @@ -65,6 +61,7 @@ export const useMainStore = defineStore('mainStore', { const trainObj = { id: train.id, + modalId: `${train.driverName}${train.trainNo}`, // simplified id for train modal trainNo: train.trainNo, mass: train.mass, @@ -131,8 +128,6 @@ export const useMainStore = defineStore('mainStore', { return trainObj; }); - - return x; }, // computed active sceneries @@ -143,7 +138,6 @@ export const useMainStore = defineStore('mainStore', { if (!apiStore.activeData?.activeSceneries) return []; - console.time('activeSceneryList'); const offlineActiveSceneries = this.trainList.reduce((acc, train) => { if (!train.timetableData) return acc; @@ -238,9 +232,16 @@ export const useMainStore = defineStore('mainStore', { const station = this.stationList.find((s) => s.name === scenery.name); - const checkpoints = [scenery.name]; - if (station?.generalInfo?.checkpoints && station.generalInfo.checkpoints.length > 0) - checkpoints.push(...station.generalInfo.checkpoints.filter((cp) => cp !== station.name)); + let checkpointsSet: Set = new Set(); + + // Add checkpoints to active scenery data + checkpointsSet.add(scenery.name.toLowerCase()); + + station?.generalInfo?.checkpoints.forEach((cpName) => { + checkpointsSet.add(cpName.toLowerCase()); + }); + + const checkpoints = Array.from(checkpointsSet); scenery.stationTrains = sceneriesTrains.get(scenery.name)?.filter((sc) => sc.region == this.region.id) ?? []; @@ -266,8 +267,6 @@ export const useMainStore = defineStore('mainStore', { }); } - console.timeEnd('activeSceneryList'); - return allActiveSceneries; }, diff --git a/src/typings/common.ts b/src/typings/common.ts index 59c4a4b..0e5393f 100644 --- a/src/typings/common.ts +++ b/src/typings/common.ts @@ -41,6 +41,7 @@ export interface RegionCounters { export interface Train { id: string; + modalId: string; mass: number; length: number; speed: number; diff --git a/src/views/TrainsView.vue b/src/views/TrainsView.vue index 7e2283f..3b86937 100644 --- a/src/views/TrainsView.vue +++ b/src/views/TrainsView.vue @@ -109,7 +109,7 @@ export default defineComponent({ this.$nextTick(() => { if (this.trainId) { - this.selectModalTrain(this.trainId); + this.selectModalTrainById(this.trainId); } }); }