client: add via
This commit is contained in:
parent
8b370d277d
commit
bc8b91a324
|
@ -28,6 +28,7 @@ export const addCache = (mode, data) => {
|
||||||
JSON.stringify(lastHistoryEntry[0].toPoint) !== JSON.stringify(data.params.toPoint)) {
|
JSON.stringify(lastHistoryEntry[0].toPoint) !== JSON.stringify(data.params.toPoint)) {
|
||||||
dataStorage.journeysHistory.push({
|
dataStorage.journeysHistory.push({
|
||||||
fromPoint: data.params.fromPoint,
|
fromPoint: data.params.fromPoint,
|
||||||
|
viaPoint: data.params.viaPoint,
|
||||||
toPoint: data.params.toPoint,
|
toPoint: data.params.toPoint,
|
||||||
reqId: data.reqId,
|
reqId: data.reqId,
|
||||||
journeyId: ''
|
journeyId: ''
|
||||||
|
@ -39,6 +40,7 @@ export const addCache = (mode, data) => {
|
||||||
} else {
|
} else {
|
||||||
dataStorage.journeysHistory.push({
|
dataStorage.journeysHistory.push({
|
||||||
fromPoint: data.params.fromPoint,
|
fromPoint: data.params.fromPoint,
|
||||||
|
viaPoint: data.params.viaPoint,
|
||||||
toPoint: data.params.toPoint,
|
toPoint: data.params.toPoint,
|
||||||
reqId: data.reqId,
|
reqId: data.reqId,
|
||||||
journeyId: ''
|
journeyId: ''
|
||||||
|
|
|
@ -6,6 +6,7 @@ export const languages = {
|
||||||
'changes': 'Umstiege',
|
'changes': 'Umstiege',
|
||||||
'products': 'Produkte',
|
'products': 'Produkte',
|
||||||
'from': 'Von',
|
'from': 'Von',
|
||||||
|
'via': 'Über',
|
||||||
'to': 'Nach',
|
'to': 'Nach',
|
||||||
'date': 'Datum',
|
'date': 'Datum',
|
||||||
'time': 'Uhrzeit',
|
'time': 'Uhrzeit',
|
||||||
|
@ -59,6 +60,7 @@ export const languages = {
|
||||||
'changes': 'Changes',
|
'changes': 'Changes',
|
||||||
'products': 'Products',
|
'products': 'Products',
|
||||||
'from': 'From',
|
'from': 'From',
|
||||||
|
'via': 'Via',
|
||||||
'to': 'To',
|
'to': 'To',
|
||||||
'date': 'Date',
|
'date': 'Date',
|
||||||
'time': 'Time',
|
'time': 'Time',
|
||||||
|
|
|
@ -12,12 +12,14 @@ import { showSettings } from './settingsView.js';
|
||||||
|
|
||||||
let currDate = new Date();
|
let currDate = new Date();
|
||||||
let fromValue = '';
|
let fromValue = '';
|
||||||
|
let viaValue = '';
|
||||||
let toValue = '';
|
let toValue = '';
|
||||||
let isArrValue = false;
|
let isArrValue = false;
|
||||||
let dateValue = currDate.getFullYear()+'-'+padZeros(currDate.getMonth()+1)+'-'+padZeros(currDate.getDate());;
|
let dateValue = currDate.getFullYear()+'-'+padZeros(currDate.getMonth()+1)+'-'+padZeros(currDate.getDate());;
|
||||||
let timeValue = padZeros(currDate.getHours())+':'+padZeros(currDate.getMinutes());
|
let timeValue = padZeros(currDate.getHours())+':'+padZeros(currDate.getMinutes());
|
||||||
let suggestionsCache = {
|
let suggestionsCache = {
|
||||||
from: {},
|
from: {},
|
||||||
|
via: {},
|
||||||
to: {},
|
to: {},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -32,6 +34,10 @@ const searchTemplate = (journeysHistory) => html`
|
||||||
<input type="text" name="from" id="from" placeholder="${t('from')}" value="${fromValue}" autocomplete="off" @focus=${startTyping} @blur=${stopTyping} @keyup=${onKeyup} @keydown=${onKeydown} required>
|
<input type="text" name="from" id="from" placeholder="${t('from')}" value="${fromValue}" autocomplete="off" @focus=${startTyping} @blur=${stopTyping} @keyup=${onKeyup} @keydown=${onKeydown} required>
|
||||||
<div class="suggestions" id="fromSuggestions"></div>
|
<div class="suggestions" id="fromSuggestions"></div>
|
||||||
|
|
||||||
|
<label for="via">${t('via')}:</label>
|
||||||
|
<input type="text" name="via" id="via" placeholder="${t('via')}" value="${viaValue}" autocomplete="off" @focus=${startTyping} @blur=${stopTyping} @keyup=${onKeyup} @keydown=${onKeydown} required>
|
||||||
|
<div class="suggestions" id="viaSuggestions"></div>
|
||||||
|
|
||||||
<label for="to">${t('to')}:</label>
|
<label for="to">${t('to')}:</label>
|
||||||
<input type="text" name="to" id="to" placeholder="${t('to')}" value="${toValue}" autocomplete="off" @focus=${startTyping} @blur=${stopTyping} @keyup=${onKeyup} @keydown=${onKeydown} required>
|
<input type="text" name="to" id="to" placeholder="${t('to')}" value="${toValue}" autocomplete="off" @focus=${startTyping} @blur=${stopTyping} @keyup=${onKeyup} @keydown=${onKeydown} required>
|
||||||
<div class="suggestions" id="toSuggestions"></div>
|
<div class="suggestions" id="toSuggestions"></div>
|
||||||
|
@ -135,6 +141,11 @@ const journeysHistoryTemplate = (journeysHistory) => html`
|
||||||
<div class="history from">
|
<div class="history from">
|
||||||
<small>${t('from')}:</small><br>
|
<small>${t('from')}:</small><br>
|
||||||
${parseName(element.fromPoint)}
|
${parseName(element.fromPoint)}
|
||||||
|
${element.viaPoint ? html`
|
||||||
|
<div class="history via">
|
||||||
|
<small>${t('via')} ${parseName(element.viaPoint)}</small>
|
||||||
|
</div>
|
||||||
|
` : ''}
|
||||||
</div>
|
</div>
|
||||||
<div class="history arrow icon-arrow1"></div>
|
<div class="history arrow icon-arrow1"></div>
|
||||||
<div class="history to">
|
<div class="history to">
|
||||||
|
@ -179,10 +190,12 @@ export const search = async (requestId) => {
|
||||||
let time = ElementById('time').value;
|
let time = ElementById('time').value;
|
||||||
let timestamp = '';
|
let timestamp = '';
|
||||||
let from = '';
|
let from = '';
|
||||||
|
let via = '';
|
||||||
let to = '';
|
let to = '';
|
||||||
|
|
||||||
currDate = new Date();
|
currDate = new Date();
|
||||||
fromValue = ElementById('from').value;
|
fromValue = ElementById('from').value;
|
||||||
|
viaValue = ElementById('via').value;
|
||||||
toValue = ElementById('to').value;
|
toValue = ElementById('to').value;
|
||||||
dateValue = ElementById('date').value;
|
dateValue = ElementById('date').value;
|
||||||
timeValue = ElementById('time').value;
|
timeValue = ElementById('time').value;
|
||||||
|
@ -224,6 +237,19 @@ export const search = async (requestId) => {
|
||||||
from = suggestions[0]
|
from = suggestions[0]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (Object.entries(suggestionsCache.via).length !== 0) {
|
||||||
|
via = suggestionsCache.via;
|
||||||
|
} else {
|
||||||
|
let suggestions = await get("/suggestions", {"query": ElementById('via').value, "results": 1}, true);
|
||||||
|
|
||||||
|
if (!suggestions[0]) {
|
||||||
|
showAlertModal("Ankunftsbahnhof ungültig");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
via = suggestions[0]
|
||||||
|
}
|
||||||
|
|
||||||
if (Object.entries(suggestionsCache.to).length !== 0) {
|
if (Object.entries(suggestionsCache.to).length !== 0) {
|
||||||
to = suggestionsCache.to;
|
to = suggestionsCache.to;
|
||||||
} else {
|
} else {
|
||||||
|
@ -251,6 +277,7 @@ export const search = async (requestId) => {
|
||||||
|
|
||||||
let params = {
|
let params = {
|
||||||
"fromPoint": from,
|
"fromPoint": from,
|
||||||
|
"viaPoint": via,
|
||||||
"toPoint": to,
|
"toPoint": to,
|
||||||
"accessibility": accessibility,
|
"accessibility": accessibility,
|
||||||
"products": products
|
"products": products
|
||||||
|
@ -294,6 +321,9 @@ export const setSuggestion = (data, inputId) => {
|
||||||
|
|
||||||
if (inputId === 'from') {
|
if (inputId === 'from') {
|
||||||
ElementById('fromSuggestions').classList.remove('mouseover');
|
ElementById('fromSuggestions').classList.remove('mouseover');
|
||||||
|
ElementById('via').focus();
|
||||||
|
} else if (inputId === 'via') {
|
||||||
|
ElementById('viaSuggestions').classList.remove('mouseover');
|
||||||
ElementById('to').focus();
|
ElementById('to').focus();
|
||||||
} else if (inputId === 'to') {
|
} else if (inputId === 'to') {
|
||||||
ElementById('toSuggestions').classList.remove('mouseover');
|
ElementById('toSuggestions').classList.remove('mouseover');
|
||||||
|
@ -399,14 +429,14 @@ const stopTyping = (e) => {
|
||||||
const mouseOverSuggestions = (e) => {
|
const mouseOverSuggestions = (e) => {
|
||||||
let el = e.target;
|
let el = e.target;
|
||||||
let i = 0;
|
let i = 0;
|
||||||
while (i++ < 10 && el.id !== 'fromSuggestions' && el.id !== 'toSuggestions') el = el.parentElement;
|
while (i++ < 10 && el.id !== 'fromSuggestions' && el.id !== 'viaSuggestions' && el.id !== 'toSuggestions') el = el.parentElement;
|
||||||
el.classList.add('mouseover');
|
el.classList.add('mouseover');
|
||||||
};
|
};
|
||||||
|
|
||||||
const stopMouseOverSuggestions = (e) => {
|
const stopMouseOverSuggestions = (e) => {
|
||||||
let el = e.target;
|
let el = e.target;
|
||||||
let i = 0;
|
let i = 0;
|
||||||
while (i++ < 10 && el.id !== 'fromSuggestions' && el.id !== 'toSuggestions') el = el.parentElement;
|
while (i++ < 10 && el.id !== 'fromSuggestions' && el.id !== 'viaSuggestions'&& el.id !== 'toSuggestions') el = el.parentElement;
|
||||||
el.classList.remove('mouseover');
|
el.classList.remove('mouseover');
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -543,7 +543,7 @@ tbody tr:hover td {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
label[for=from], label[for=to], label[for=isarr], label[for="date"], label[for=time] {
|
label[for=from], label[for=via], label[for=to], label[for=isarr], label[for="date"], label[for=time] {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -688,6 +688,9 @@ form>div.history {
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.history.via {
|
||||||
|
font-weight: 200;
|
||||||
|
}
|
||||||
.history.from,
|
.history.from,
|
||||||
.history.to {
|
.history.to {
|
||||||
width: 40%;
|
width: 40%;
|
||||||
|
|
Loading…
Reference in a new issue