{% extends 'admin/base.html' %}
{% block _title %}{{ _('Languages') }}{% endblock %}
{% set langs_link = 'active' %}
{% block _content %}
	<form hx-post="{{ url_for('api.updateConfig') }}" hx-target="#response-container" hx-swap="none">
		<h2 id="general" class="mb-2 fw-normal">{{ _('Languages') }}</h2>
		<p class="fs-5 h3 text-body-secondary mb-3">{{ _('Language settings') }}</p>
		<div class="form-group mb-3">
			<label class="form-label" for="languages.default">{{ _('Default language') }}</label>
			<select id="languages.default" name="languages.default" class="form-select">
				<option value="en_US"{% if cfg.languages.default == 'en_US' %} selected{% endif %}>{{ _('English (US)') }}</option>
				<option value="ru_RU"{% if cfg.languages.default == 'ru_RU' %} selected{% endif %}>{{ _('Russian') }}</option>
			</select>
		</div>
		<div class="form-check form-switch mb-3">
			<input
			class="form-check-input"
			type="checkbox"
			name="_languages.allowChanging"
			id="_languages.allowChanging"
			value="{{ cfg.languages.allowChanging }}"
			role="switch"
			{% if cfg.languages.allowChanging %}checked{% endif %}>
			<input type="hidden" id="languages.allowChanging" name="languages.allowChanging" value="{{ cfg.languages.allowChanging }}">
			<label for="_languages.allowChanging" class="form-check-label">{{ _("Allow users to locally change the language") }}</label>
		</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 %}