package tpl

import "fmt"

var captchaHandler = templ.NewOnceHandle()

templ AddQuotePage(form *AddQuoteForm, err string) {
	{{ captchaURL := fmt.Sprintf("/captcha/download/%s.png", form.CaptchaID) }}
	@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 }/>
			<label for="captcha_value">
				<img class="captcha" id="captcha" src={ captchaURL }/>
				<a
					role="button"
					data-url={ captchaURL }
					onclick="reloadCaptcha(this)"
				>
					<i class="fa fa-refresh"></i>&nbsp;Обновить капчу
				</a>
			</label>
			<input type="text" name="captcha_value" id="captcha_value" placeholder="Код с картинки"/>
			<input type="submit" value="Отправить на модерацию"/>
		</form>
		@captchaHandler.Once() {
			<script type="text/javascript">
				function reloadCaptcha(event) {
					const url = event.getAttribute('data-url');
					document.getElementById('captcha').setAttribute('src', url+'?reload='+Math.random());
				}
			</script>
		}
	}
}

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