path: root/pkg/tpl/add.templ

package tpl

import "fmt"

templ AddQuotePage(form *AddQuoteForm, err string) {
	@Layout(HeaderParams{}) {
		<h2>Добавление цитаты</h2>
		if err != "" {
			<article>
				<header>Ошибка</header>
				{ err }
			</article>
		}
		<form method="post">
			<textarea rows="5" name="quote" placeholder="Текст цитаты">{ form.Quote }</textarea>
			<input type="hidden" name="captcha_id" value={ form.CaptchaID }/>
			<div role="group">
				<img class="captcha" src={ fmt.Sprintf("/captcha/download/%s.png", form.CaptchaID) }/>
				<audio id="audiocaptcha" src={ fmt.Sprintf("/captcha/download/%s.wav?lang=ru", form.CaptchaID) }></audio>
				<a role="button" onclick="togglePlay()">Прослушать</a>
				<input type="text" name="captcha_value" placeholder="Код с картинки"/>
			</div>
			<input type="submit" value="Отправить на модерацию"/>
		</form>
		<script>
			var myAudio = document.getElementById("audiocaptcha");
			var isPlaying = false;
			function togglePlay() {
				isPlaying ? myAudio.pause() : myAudio.play();
			};
			myAudio.onplaying = function() {
				isPlaying = true;
			};
			myAudio.onpause = function() {
				isPlaying = false;
			};
		</script>
	}
}

type AddQuoteForm struct {
	Quote        string `form:"quote"`
	CaptchaID    string `form:"captcha_id"`
	CaptchaValue string `form:"captcha_value"`
}