{% extends 'admin/base.html' %}
{% block _title %}{{ _('Notifications') }}{% endblock %}
{% set notif_link = 'active' %}
{% block _content %}
	<form hx-post="{{ url_for('api.updateConfig') }}" hx-target="#response-container" hx-swap="none" hx-disabled-elt="#saveConfig">
		<h2 id="general" class="mb-22 fw-normal">{{ _('Notifications') }}</h2>
		<p class="fs-5 h3 text-body-secondary mb-3">{{ _('Configure notifications for new questions using') }} <a href="https://ntfy.sh/" target="_blank">ntfy</a></p>
		<div class="form-check form-switch mb-3">
			<input
			class="form-check-input"
			type="checkbox"
			name="_ntfy.enabled"
			id="_ntfy.enabled"
			value="{{ cfg.ntfy.enabled }}"
			role="switch"
			{% if cfg.ntfy.enabled %}checked{% endif %}>
			<input type="hidden" id="ntfy.enabled" name="ntfy.enabled" value="{{ cfg.ntfy.enabled }}">
			<label for="_ntfy.enabled" class="form-check-label">{{ _('Enabled') }}</label>
		</div>
		<p class="form-label">{{ _('Server &amp; Topic') }}</p>
		<div class="input-group mb-4">
			<input type="text" id="ntfy.host" name="ntfy.host" value="{{ cfg.ntfy.host }}" class="form-control" aria-label="{{ _('Server') }}">
			<span class="input-group-text">/</span>
			<input type="text" id="ntfy.topic" name="ntfy.topic" value="{{ cfg.ntfy.topic }}" class="form-control" aria-label="{{ _('Topic') }}">
		</div>
		<h3 class="fw-light mb-2">{{ _('Credentials') }} {{ _('(optional)') }}</h3>
		<p class="text-body-secondary mb-3">{{ _('Set credentials if the topic is protected') }}</p>
		<div class="form-group mb-3 mt-2">
			<label class="form-label" for="ntfy.user">{{ _('Username') }}</label>
			<input type="text" id="ntfy.user" name="ntfy.user" value="{{ cfg.ntfy.user }}" class="form-control">
			<p class="form-text">
				{{ _('Topic user') }}
			</p>
		</div>
		<div class="form-group mb-3">
			<label class="form-label" for="ntfy.pass">{{ _('Password') }}</label>
			<input type="password" id="ntfy.pass" name="ntfy.pass" value="{{ cfg.ntfy.pass }}" class="form-control">
			<p class="form-text">
				{{ _('Topic password') }}
			</p>
		</div>
		{% include 'snippets/admin/saveBtn.html' %}
	</form>
{% endblock %}
{% block _scripts %}
<script>
	// fix handling checkboxes
	document.querySelectorAll('.form-check-input[type=checkbox]').forEach(function(checkbox) {
		checkbox.addEventListener('change', function() {
			checkbox.nextElementSibling.value = this.checked ? 'True' : 'False';
		});
	});
</script>
{% endblock %}