<!DOCTYPE html>
<html>
	<head>
		<title>Search results for "{{.SearchPhrase}}"</title>
		<style>
			table, th, td {
				border: 1px solid black;
				border-collapse: collapse;
			}
			th {
				cursor: pointer;
			}
		</style>
		<script type="text/javascript" src="/static/processResults.js"></script>
	</head>
	<body onload="app.sortTable()">
		<div><a href="/"><b>Search again</b></a></div>
		<br/>
		<div>Filter: 
			<input id="filter" type="text" name="name" placeholder="type phrase<ENTER>" onchange="app.filterTable(this.value)" autocomplete="off">
			<button class="btn" onclick="app.clearFilter()">Clear filter</button>
			<i>Click on column to sort</i>
		</div>
		<table>
			<thead>
				<tr style='text-align: left'>
					<th>Source</th>
					<th>Translation</th>
					<th>TM</th>
				</tr>
			</thead>
			<tbody id="dataRows">
			{{range $result := .Results}}
				{{range $segment := $result.Segments}}
				<tr style='text-align: left'>
					<td>{{$segment.Source}}</td>
					<td>{{$segment.Target}}</td>
					<td>{{$result.TMName}}</td>
				</tr>
				{{end}}
			{{end}}
			</tbody>
		</table>
		<br/>
		<a href="/">Search again</a>
	</body>
</html>