Poprawki w tablicy rozkładów.

This commit is contained in:
2020-11-26 21:17:29 +01:00
parent 00ed6f775f
commit 83fe4d4a3d
+83 -152
View File
@@ -25,11 +25,7 @@
</div> </div>
<div class="timetable-body"> <div class="timetable-body">
<div <div class="timetable-item" v-for="timetable in computedRows" :key="timetable.trainNo">
class="timetable-item"
v-for="(timetable, i) in computedRows"
:key="timetable.trainNo"
>
<div class="row-bar"></div> <div class="row-bar"></div>
<div class="timetable-row"> <div class="timetable-row">
<span class="row-destination"> <span class="row-destination">
@@ -213,41 +209,45 @@ let nextRefreshTime = 0;
export default class TimetableView extends Vue { export default class TimetableView extends Vue {
@Getter("getStationList") stationList!: Station[]; @Getter("getStationList") stationList!: Station[];
maxRows = 5;
options = { options = {
excludeCargo: { name: "Tylko pasażerskie", state: false }, excludeCargo: { name: "Tylko pasażerskie", state: false },
playSounds: { name: "Dźwięki", state: false }, playSounds: { name: "Dźwięki", state: false },
}; };
timetableRows: TimetableRow[] = new Array(6).fill(0).map((row) => ({ timetableRows: TimetableRow[] = new Array(this.maxRows)
origin: new Array(13).fill(" "), .fill(0)
.map((row) => ({
origin: new Array(13).fill(" "),
destinationTable: new Array(13).fill(" "), destinationTable: new Array(13).fill(" "),
destinationString: "", destinationString: "",
nearestStopTable: new Array(13).fill(" "), nearestStopTable: new Array(13).fill(" "),
nearestStopString: "", nearestStopString: "",
departureHoursTable: new Array(2).fill(" "), departureHoursTable: new Array(2).fill(" "),
departureHoursString: "", departureHoursString: "",
departureMinutesTable: new Array(2).fill(" "), departureMinutesTable: new Array(2).fill(" "),
departureMinutesString: "", departureMinutesString: "",
trainNumberTable: new Array(6).fill(" "), trainNumberTable: new Array(6).fill(" "),
trainNumberString: "", trainNumberString: "",
trainCategoryTable: new Array(3).fill(" "), trainCategoryTable: new Array(3).fill(" "),
trainCategoryString: "", trainCategoryString: "",
category: "", category: "",
number: 0, number: 0,
delay: 0, delay: 0,
delayPlate: "", delayPlate: "",
departureTimestamp: 0, departureTimestamp: 0,
arrivalTimestamp: 0, arrivalTimestamp: 0,
})); }));
mounted() { mounted() {
window.requestAnimationFrame(this.findNextLetters); window.requestAnimationFrame(this.findNextLetters);
@@ -261,57 +261,62 @@ export default class TimetableView extends Vue {
/* Options */ /* Options */
setOption(optionKey: string, optionValue: any) { setOption(optionKey: string, optionValue: any) {
this.$set(this.options[optionKey], "state", optionValue); this.$set(this.options[optionKey], "state", optionValue);
// this.options[optionKey].state = optionValue; // this.options[optionKey].state = optionValue;
} }
/* ===== */ /* ===== */
resetTimetable(indexFrom: number = 0) { resetTimetable(indexFrom: number = 0, forceClear: boolean = false) {
if (indexFrom > this.maxRows - 1) return;
console.log("reset");
for (let i = indexFrom; i < this.timetableRows.length; i++) { for (let i = indexFrom; i < this.timetableRows.length; i++) {
const currentRow = this.timetableRows[i]; const currentRow = this.timetableRows[i];
for (let propName in currentRow) { for (let propName in currentRow) {
let currentProp = currentRow[propName]; let propValue = currentRow[propName];
switch (typeof currentProp) { switch (typeof propValue) {
case "object": case "object":
currentProp = currentProp.map((v) => " "); propValue = propValue.map((v) => " ");
this.addToSeek(i, propName, propValue, false);
this.$set(this.timetableRows[i], propName, propValue);
break; break;
case "string": case "string":
currentProp = ""; propValue = "";
this.$set(this.timetableRows[i], propName, propValue);
break; break;
case "number": case "number":
currentProp = 0; propValue = 0;
this.$set(this.timetableRows[i], propName, propValue);
break; break;
} }
this.$set(this.timetableRows[i], propName, currentProp);
} }
} }
} }
addToSeek( addToSeek(
currentRow: TimetableRow,
currentRowIndex: number, currentRowIndex: number,
arrayName: string, arrayName: string,
next: string, next: string | string[],
numeric: boolean numeric: boolean
) { ) {
globalID++; // globalID++;
console.log(arrayName, currentRow[arrayName]); this.timetableRows[currentRowIndex][arrayName].forEach((letter, i) => {
currentRow[arrayName].forEach((char, i) => {
letterSeekArray.push({ letterSeekArray.push({
currentRowIndex, currentRowIndex,
letterIndex: i, letterIndex: i,
currentChar: char, currentChar: letter,
finalChar: next[i] || (numeric ? "0" : " "), finalChar: next[i] ? next[i] : numeric ? "0" : " ",
arrayName, arrayName,
numeric, numeric,
id: globalID, id: ++globalID,
}); });
}); });
} }
@@ -328,40 +333,40 @@ export default class TimetableView extends Vue {
return info || null; return info || null;
} }
get computedRows(): TimetableRow[] { updateRows(info: Station | null = this.stationInfo) {
if (!this.stationInfo) return this.timetableRows; if (!info) return;
if ( if (info.scheduledTrains.length == 0) return;
!this.stationInfo.scheduledTrains ||
this.stationInfo.scheduledTrains.length == 0
)
return this.timetableRows;
const scheduledTrains = this.stationInfo.scheduledTrains console.log("update");
.filter(
(train) => {
if (train.stopInfo.departureTimestamp == 0) return false;
if (!this.options.excludeCargo.state) return true; const scheduledTrains = info.scheduledTrains
.filter((train) => {
const trainNumberLength = train.trainNo.toString().length; if (train.stopInfo.departureTimestamp == 0) return false;
if (trainNumberLength === 4 || trainNumberLength === 5) return true;
if (this.options.excludeCargo.state) {
if (train.trainNo.toString().length === 5) return true;
return false; return false;
} }
// includesLetters(train.category.split("")[1], ["P", "I", "O"]) // if (!this.options.excludeCargo.state) return true;
)
// const trainNumberLength = train.trainNo.toString().length;
// if (trainNumberLength === 4 || trainNumberLength === 5) return true;
return true;
})
.sort((a, b) => { .sort((a, b) => {
if (a.stopInfo.departureTimestamp >= b.stopInfo.departureTimestamp) if (a.stopInfo.departureTimestamp >= b.stopInfo.departureTimestamp)
return 1; return 1;
else return -1;
return -1;
}); });
let currentRowIndex = 0; let currentRowIndex = 0;
for (let train of scheduledTrains) { for (let train of scheduledTrains) {
if (train.stopInfo.confirmed) continue; if (train.stopInfo.confirmed) continue;
if (currentRowIndex > this.timetableRows.length - 1) break; if (currentRowIndex > this.maxRows - 1) break;
const currentRow = this.timetableRows[currentRowIndex]; const currentRow = this.timetableRows[currentRowIndex];
@@ -385,129 +390,49 @@ export default class TimetableView extends Vue {
} }
if (currentRow.destinationString !== destination) { if (currentRow.destinationString !== destination) {
this.addToSeek( console.log(destination);
currentRow,
currentRowIndex,
"destinationTable",
destination,
false
);
// currentRow.destinationTable.forEach((letter, i) => { this.addToSeek(currentRowIndex, "destinationTable", destination, false);
// this.addToSeek(
// currentRowIndex,
// i,
// letter,
// destination[i] ? destination[i].toUpperCase() : " ",
// "destinationTable",
// false
// );
// });
} }
if (currentRow.nearestStopString !== nearestStop) { if (currentRow.nearestStopString !== nearestStop) {
this.addToSeek( this.addToSeek(currentRowIndex, "nearestStopTable", nearestStop, false);
currentRow,
currentRowIndex,
"nearestStopTable",
nearestStop,
false
);
// currentRow.nearestStopTable.forEach((letter, i) => {
// this.addToSeek(
// currentRowIndex,
// i,
// letter,
// nearestStop[i] ? nearestStop[i].toUpperCase() : " ",
// "nearestStopTable",
// false
// );
// });
} }
if (currentRow.departureHoursString != departureHours.toString()) { if (currentRow.departureHoursString != departureHours.toString()) {
this.addToSeek( this.addToSeek(
currentRow,
currentRowIndex, currentRowIndex,
"departureHoursTable", "departureHoursTable",
departureHours.toString(), departureHours,
true true
); );
// currentRow.departureHoursTable.forEach((num, i) => {
// this.addToSeek(
// currentRowIndex,
// i,
// num,
// departureHours[i] ? departureHours[i] : "0",
// "departureHoursTable",
// true
// );
// });
} }
if (currentRow.departureMinutesString != departureMinutes.toString()) { if (currentRow.departureMinutesString != departureMinutes.toString()) {
this.addToSeek( this.addToSeek(
currentRow,
currentRowIndex, currentRowIndex,
"departureMinutesTable", "departureMinutesTable",
departureMinutes.toString(), departureMinutes,
true true
); );
// currentRow.departureMinutesTable.forEach((num, i) => {
// this.addToSeek(
// currentRowIndex,
// i,
// num,
// departureMinutes[i] ? departureMinutes[i] : "0",
// "departureMinutesTable",
// true
// );
// });
} }
if (currentRow.trainNumberString != train.trainNo.toString()) { if (currentRow.trainNumberString != train.trainNo.toString()) {
this.addToSeek( this.addToSeek(
currentRow,
currentRowIndex, currentRowIndex,
"trainNumberTable", "trainNumberTable",
trainNumberString, trainNumberString,
true true
); );
// currentRow.trainNumberTable.forEach((num, i) => {
// this.addToSeek(
// currentRowIndex,
// i,
// num,
// trainNumberString[i] ? trainNumberString[i] : " ",
// "trainNumberTable",
// true
// );
// });
} }
if (currentRow.trainCategoryString != train.category) { if (currentRow.trainCategoryString != train.category) {
this.addToSeek( this.addToSeek(
currentRow,
currentRowIndex, currentRowIndex,
"trainCategoryTable", "trainCategoryTable",
train.category, train.category,
false false
); );
// currentRow.trainCategoryTable.forEach((letter, i) => {
// this.addToSeek(
// currentRowIndex,
// i,
// letter,
// train.category[i] ? train.category[i] : " ",
// "trainCategoryTable",
// false
// );
// });
} }
if (currentRow.delayPlate != currentRow.delay.toString()) { if (currentRow.delayPlate != currentRow.delay.toString()) {
@@ -540,6 +465,10 @@ export default class TimetableView extends Vue {
} }
this.resetTimetable(currentRowIndex); this.resetTimetable(currentRowIndex);
}
get computedRows(): TimetableRow[] {
this.updateRows();
return this.timetableRows; return this.timetableRows;
} }
@@ -549,6 +478,7 @@ export default class TimetableView extends Vue {
for (let i = 0; i < letterSeekArray.length; i++) { for (let i = 0; i < letterSeekArray.length; i++) {
const wanted = letterSeekArray[i]; const wanted = letterSeekArray[i];
const currentSet = wanted.numeric ? numberSet : letterSet; const currentSet = wanted.numeric ? numberSet : letterSet;
if (wanted.currentChar === wanted.finalChar) { if (wanted.currentChar === wanted.finalChar) {
@@ -621,10 +551,10 @@ export default class TimetableView extends Vue {
findNextLetters(time) { findNextLetters(time) {
if (time > nextRefreshTime) { if (time > nextRefreshTime) {
this.seekMainLetters(); this.seekMainLetters();
this.seekDelayPlate(); // this.seekDelayPlate();
// this.seekSideLetters(time); // this.seekSideLetters(time);
nextRefreshTime = time + 200; nextRefreshTime = time + 140;
} }
// console.log( // console.log(
@@ -829,12 +759,13 @@ $bg: #111;
.roll-anim-enter-active, .roll-anim-enter-active,
.roll-anim-leave-active { .roll-anim-leave-active {
transition: transform 90ms; transition: transform 70ms;
will-change: transform; will-change: transform;
// opacity: 0; // opacity: 0;
} }
.roll-anim-enter, .roll-anim-leave-to /* .list-leave-active below version 2.1.8 */ { .roll-anim-enter,
.roll-anim-leave-to {
transform: rotate3d(1, 0, 0, -90deg); transform: rotate3d(1, 0, 0, -90deg);
// opacity: 0; // opacity: 0;
} }