mai/web/views/index.html
manerakai 4b95465cbe Improved code
git-svn-id: file:///srv/svn/repo/mai/trunk@20 e410bdd4-646f-c54f-a7ce-fffcc4f439ae
2023-08-31 08:28:02 +00:00

88 lines
3.0 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<title>SimplyTranslate</title>
<link rel="shortcut icon" href="/static/favicon.ico">
<meta name="description" content="Experience simple and private Google translations">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'">
<meta name="referrer" content="no-referrer">
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
<header class="center">
<h1>SimplyTranslate</h1>
</header>
<form action="/?engine={{.Engine}}" method="POST" id="translation-form">
<div class="center">
Translation Engine
{{$i := 0}}
{{ range $k, $v := .enginesNames }}
<a {{ if eq $k $.Engine }}style="text-decoration:underline" {{end}} href="/?engine={{ $k }}">{{ $v }}</a>
{{$i = (inc $i)}}
{{if eq $i (len $.enginesNames)}}{{else}}|{{end}}
{{end}}
</div>
<br>
<div class="wrap languages">
<div class="language">
<select name="from" aria-label="Source language">
{{range $code, $name := .SourceLanguages}}
<option value="{{ $code }}" {{if eq $code $.From}}selected{{end}}>{{ $name }}</option>
{{end}}
</select>
</div>
<div class="switch_languages">
<button id="switchbutton" aria-label="Switch languages"
formaction="/switchlanguages/?engine={{ .Engine }}" type="submit">&lt;-&gt;</button>
</div>
<div class="language">
<select name="to" aria-label="Target language">
{{range $code, $name := .TargetLanguages}}
<option value="{{ $code }}" {{if eq $code $.To}}selected{{end}}>{{ $name }}</option>
{{end}}
</select>
</div>
</div>
<div class="wrap">
<div class="item-wrapper">
<textarea autofocus class="item" id="input" name="text" dir="auto"
placeholder="Enter Text Here">{{ .OriginalText }}</textarea>
{{if .TtsFrom}}
<audio controls>
<source type="audio/mpeg" src="{{ .TtsFrom }}">
</audio>
{{end}}
</div>
<div class="item-wrapper">
<textarea id="output" class="translation item" dir="auto" placeholder="Translation"
readonly>{{.TranslatedText}}</textarea>
{{if .TtsTo}}
<audio controls>
<source type="audio/mpeg" src="{{ .TtsTo }}">
</audio>
{{end}}
</div>
</div>
<br>
<div class="center">
<button type="submit">Translate with {{ .Engine }}!</button>
</div>
</form>
<script src="/static/script.js"></script>
</body>
</html>