56 lines
1.7 KiB
HTML
56 lines
1.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>MultiTrain</title>
|
|
<link rel="stylesheet" href="/style.css">
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<h1>MultiTrain</h1>
|
|
<p class="subtitle">Train connections from many starts to many destinations, ranked with station penalties.</p>
|
|
|
|
<form id="search-form">
|
|
<div class="stations">
|
|
<fieldset>
|
|
<legend>From</legend>
|
|
<div id="from-rows" class="rows" data-side="from"></div>
|
|
<button type="button" class="add" data-target="from-rows">+ add start</button>
|
|
</fieldset>
|
|
<fieldset>
|
|
<legend>To</legend>
|
|
<div id="to-rows" class="rows" data-side="to"></div>
|
|
<button type="button" class="add" data-target="to-rows">+ add destination</button>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="time-row">
|
|
<select id="time-mode">
|
|
<option value="now" selected>Depart now</option>
|
|
<option value="departure">Depart at</option>
|
|
<option value="arrival">Arrive by</option>
|
|
</select>
|
|
<input type="datetime-local" id="time-value" hidden>
|
|
<button type="submit" id="search-button">Search</button>
|
|
</div>
|
|
</form>
|
|
|
|
<section id="feedback" hidden></section>
|
|
|
|
<section id="results-section" hidden>
|
|
<div class="results-header">
|
|
<h2>Connections</h2>
|
|
<label>Sort by
|
|
<select id="sort-mode">
|
|
<option value="score" selected>best (incl. penalty)</option>
|
|
<option value="time">departure time</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
<ol id="results"></ol>
|
|
</section>
|
|
</main>
|
|
<script src="/app.js"></script>
|
|
</body>
|
|
</html>
|