1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
import { html, css, nothing } from 'lit';
import { unsafeHTML } from 'lit/directives/unsafe-html.js';
import { settingsState } from './settings.js';
import { getDS100byIBNR } from './ds100.js';
import { CustomDate } from './helpers.js';
export const remarksModal = (element, remarks) => element.showDialogOverlay('remarks', [
remarks.map(remark => html`
<div class="flex-row">
<span class="icon-${remark.type}"></span>
<span>${unsafeHTML(remark.text)}</span>
</div>
`),
html`<style>${css`
.flex-row {
align-items: center;
flex-wrap: nowrap !important;
padding: .5em;
border-bottom: 1px solid rgba(0, 0, 0, .4);
}
.flex-row:last-child {
border-bottom: unset;
}
span[class^="icon-"] {
align-self: start;
padding-right: .3em;
}
`}</style>`
]);
export const stopTemplate = (profile, stop) => {
let stopName = stop.name;
if (settingsState.showDS100) {
const ds100 = getDS100byIBNR(stop.id);
if (ds100 !== null) stopName += ` (${ds100})`;
}
return html`<a href="#/d/${profile}/${stop.id}">${stopName}</a>`;
}
export const platformTemplate = data => {
if (data.departurePlatform) {
if (data.departurePlatform != data.plannedDeparturePlatform) {
return html`<b>${data.departurePlatform}</b>`;
} else {
return data.plannedDeparturePlatform;
}
} else if (data.platform) {
if (data.platform != data.plannedPlatform) {
return html`<b>${data.platform}</b>`;
} else {
return data.plannedPlatform;
}
} else if (data.arrivalPlatform) {
if (data.arrivalPlatform != data.plannedArrivalPlatform) {
return html`<b>${data.arrivalPlatform}</b>`;
} else {
return data.plannedArrivalPlatform;
}
} else {
return '-';
}
};
export const timeTemplate = (data, mode) => {
const fieldsMap = {
when: {
departure: 'departure',
arrival: 'arrival',
},
plannedWhen: {
departure: 'plannedDeparture',
arrival: 'plannedArrival',
},
delay: {
departure: 'departureDelay',
arrival: 'arrivalDelay',
},
};
const getField = fieldName => data[fieldsMap[fieldName][mode] || fieldName];
let timeStr;
const dateObj = getField('when') || getField('plannedWhen');
if (!dateObj) return '-';
if (dateObj.toLocaleDateString() !== new CustomDate().toLocaleDateString()) {
timeStr = `${dateObj.formatTime()}, ${dateObj.getDate()}.${dateObj.getMonth() + 1}.`;
} else {
timeStr = dateObj.formatTime();
}
const delayMinutes = Math.round(getField('delay') / 60);
return html`${timeStr}${delayMinutes != 0 ? html` <b>(${delayMinutes > 0 ? '+' : ''}${delayMinutes})</b>` : nothing}`;
};