ctucx.git: oeffi-web

[nimlang] oeffisearch fork that works without javascript

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 
100 
101 
102 
103 
104 
105 
106 
107 
108 
109 
110 
111 
112 
113 
114 
115 
116 
117 
<!DOCTYPE html>
<html lang="de">
	<head>
		<title>Öffisearch</title>
		<meta charset="UTF-8">

		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="theme-color" content="#ffffff">
		<meta name="description" content="Plan your public transport journeys">

		<link rel="icon" type="image/png" sizes="64x64" href="/assets/favicon-64x64.png">
		<link rel="manifest" href="/assets/manifest.json">
		<link rel="stylesheet" type="text/css" href="/assets/style.css">

		<link rel="modulepreload" href="/assets/js/lit-html.js">
		<link rel="modulepreload" href="/assets/js/helpers.js">
	</head>
	<body class="center">
		<form method="post" class="search">
			<div class="title">
				<div class="logo"></div>
				<h1>Öffisearch</h1>
			</div>

			<div class="input-group">
				<label for="from">{{LABEL_FROM}}:</label>
				<input type="text" name="from" id="from" placeholder="{{LABEL_FROM}}" autocomplete="off" value="{{FROM}}" required>
				<div class="suggestions" id="fromSuggestions"></div>

				<label for="via">{{LABEL_VIA}} ({{LABEL_OPTIONAL}}):</label>
				<input type="text" name="via" id="via" placeholder="{{LABEL_VIA}} ({{LABEL_OPTIONAL}})" autocomplete="off">
				<div class="suggestions" id="viaSuggestions"></div>

				<label for="to">{{LABEL_TO}}:</label>
				<input type="text" name="to" id="to" placeholder="{{LABEL_TO}}" autocomplete="off" value="{{TO}}" required>
				<div class="suggestions" id="toSuggestions"></div>

			</div>

			<div class="row">
				<label class="switch">
					<input type="checkbox" name="isarr">
					<span class="slider {{LABEL_LANG}}"></span>
					<label for="isarr">{{LABEL_ISARR}} <br></label>
				</label>

				<label for="date">{{LABEL_DATE}}:</label>
				<input type="date" name="date" id="date" value="{{DATE}}" placeholder="{{LABEL_DATE}}" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" required>

				<label for="time"><br>{{LABEL_TIME}}:</label>
				<input type="time" name="time" id="time" value="{{TIME}}" placeholder="{{LABEL_TIME}}" pattern="[0-9]{2}:[0-9]{2}" required>
			</div>

			<div class="row">
				<span class="hidden">{{LABEL_PRODUCTS}}:</span>

				<div class="selector">
					<input type="checkbox" id="nationalExp" name="nationalExp" checked>
					<label class="icon-ice" for="nationalExp" title="{{LABEL_ICE}}">{{LABEL_ICE}}<br></label>

					<input type="checkbox" id="national" name="national" checked>
					<label class="icon-ic" for="national" title="{{LABEL_IC}}">{{LABEL_IC}}<br></label>

					<input type="checkbox" id="regionalExp" name="regionalExp" checked>
					<label class="icon-dzug" for="regionalExp" title="{{LABEL_DZUG}}">{{LABEL_DZUG}}<br></label>

					<input type="checkbox" id="regional" name="regional" checked>
					<label class="icon-regional" for="regional" title="{{LABEL_REGIONAL_TRAIN}}">{{LABEL_REGIONAL_TRAIN}}<br></label>

					<input type="checkbox" id="suburban" name="suburban" checked>
					<label class="icon-suburban" for="suburban" title="{{LABEL_SUBURBAN_TRAIN}}">{{LABEL_SUBURBAN_TRAIN}}<br></label>

					<input type="checkbox" id="subway" name="subway" checked>
					<label class="icon-subway" for="subway" title="{{LABEL_SUBWAY}}">{{LABEL_SUBWAY}}<br></label>

					<input type="checkbox" id="tram" name="tram" checked>
					<label class="icon-tram" for="tram" title="{{LABEL_TRAM}}">{{LABEL_TRAM}}<br></label>

					<input type="checkbox" id="bus" name="bus" checked>
					<label class="icon-bus" for="bus" title="{{LABEL_BUS}}">{{LABEL_BUS}}<br></label>

					<input type="checkbox" id="ferry" name="ferry" checked>
					<label class="icon-ferry" for="ferry" title="{{LABEL_FERRY}}">{{LABEL_FERRY}}<br></label>

					<input type="checkbox" id="taxi" name="taxi" checked>
					<label class="icon-taxi" for="taxi" title="{{LABEL_TAXI}}">{{LABEL_TAXI}}<br></label>
				</div>

				<span class="hidden">{{LABEL_ACCESSIBILITY}}:</span>
				<div class="selector">
					<input type="radio" id="accessibilityNone" name="accessibility" value="none" checked>
					<label class="icon-walk-fast" for="accessibilityNone" title="{{LABEL_ACCESSIBILITY_NONE}}">{{LABEL_ACCESSIBILITY_NONE}}<br></label>

					<input type="radio" id="accessibilityPartial" name="accessibility" value="partial">
					<label class="icon-walk" for="accessibilityPartial" title="{{LABEL_ACCESSIBILITY_PARTIAL}}">{{LABEL_ACCESSIBILITY_PARTIAL}}<br></label>

					<input type="radio" id="accessibilityComplete" name="accessibility" value="complete">
					<label class="icon-wheelchair" for="accessibilityComplete" title="{{LABEL_ACCESSIBILITY_FULL}}">{{LABEL_ACCESSIBILITY_FULL}}<br></label>
				</div>

				<div class="selector">
					<div id="btn-swap" class="btn swap hidden"></div>
				</div>

				<button class="btn go" type="submit" tabindex="0" id="go">
					{{LABEL_SEARCH}}
					<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2L4.5 20.29l.71.71L12 18l6.79 3 .71-.71z"/></svg>
				</button>
			</div>

			<center>{{LABEL_LANGUAGE}}: <a href="/?lang=de">Deutsch</a> &middot; <a href="/?lang=en">Englisch</a></center>
		</form>

		<div id="overlay" class="hidden"></div>
		<script type="module" src="/assets/js/search.js" defer></script>
	</body>
</html>