{% extends "custom_field_list.tpl.html" %}
<!-- $Id: custom_field_text_i18n.tpl.html,v 1.1 2026/03/16 13:05:15 rtigero Exp $ -->

{% block field %}
<div id="div_{{ custom_field.NAME }}">
	{% for index, value in custom_field.VALUES %}
		{% block i18n_input %}
			<input id="{{ custom_field.NAME }}_{{ loop.counter0 }}" type="text" size="50" maxlength="255" name="{{ custom_field.NAME }}[{{ loop.counter0 }}]" data-form-name="{{ custom_field.NAME }}_" value="{{ value.value }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
		{% endblock %}
		<input id="{{ custom_field.NAME }}_lang_{{ loop.counter0 }}" class="saisie-10emr pmb-input" type="text" value="{{ value.lang.lib }}" autfield="{{ custom_field.NAME }}_lang_code_{{ loop.counter0 }}" completion="langue" autocomplete="off" data-form-name="{{ custom_field.NAME }}_lang_" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
		<button class="bouton pmb-input" type="button" onclick="this.form.{{ custom_field.NAME }}_lang_{{ loop.counter0 }}.value=''; this.form.{{ custom_field.NAME }}_lang_code_{{ loop.counter0 }}.value=''; this.form.{{ custom_field.NAME }}_{{ loop.counter0 }}.value = ''" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">{{ msg.custom_fields_raz_button }}</button>
		<input id="{{ custom_field.NAME }}_lang_code_{{ loop.counter0 }}" data-form-name="{{ custom_field.NAME }}_lang_code_" type="hidden" value="{{ value.lang.value }}" name="{{ custom_field.NAME }}_langs[{{ loop.counter0 }}]" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
	{% endfor %}
	{% if custom_field.REPEATABLE %}
		<button type="button" id="button_add_custom_text_i18n_{{ custom_field.NAME }}" name="" class="bouton" onclick="add_custom_text_i18n_{{ custom_field.NAME }}()" aria-label="{{ msg.custom_fields_add_aria_label | printf custom_field.TITRE }}">{{ msg.custom_fields_add_button }}</button>
	{% endif %}
	<br>
	<input id="customfield_text_i18n_{{ custom_field.ID }}" type="hidden" name="customfield_text_i18n_{{ custom_field.ID }}" value="{{ custom_field.VALUES | length }}" class="pmb-input" aria-describedby="pmb-input-{{ custom_field.NAME }}-desc-error">
</div>

{% if custom_field.REPEATABLE == "1" %}
	<script>
		if(typeof form == "undefined") {
			var form = document.currentScript.closest("form");
		}

		window["add_custom_text_i18n_{{ custom_field.NAME }}"] = function() {
			let field_id = "{{ custom_field.ID }}";
			let field_name = "{{ custom_field.NAME }}";
			let field_size = "{{ custom_field.SIZE }}";
			let field_maxlen = "{{ custom_field.MAXSIZE }}";

			var count = document.getElementById('customfield_text_i18n_'+field_id).value;
			var text = document.createElement('input');
			text.setAttribute('id', field_name + '_' + count);
			text.setAttribute('name',field_name+'[' + count + ']');
			text.setAttribute('type','text');
			text.setAttribute('value','');
			text.setAttribute('size',field_size);
			text.setAttribute('maxlength',field_maxlen);

			var lang = document.createElement('input');
			lang.setAttribute('id', field_name + '_lang_' + count);
			lang.setAttribute('class', 'saisie-10emr');
			lang.setAttribute('type', 'text');

			{% if custom_field.DEFAULT_LANG %}
				//On html_entity_decode comme on peut
				let default_lang = "{{ custom_field.DEFAULT_LANG.lib }}";
				let textarea = document.createElement('textarea');
				textarea.innerHTML = default_lang;
				lang.setAttribute('value', textarea.value);
			{% endif %}

			lang.setAttribute('autfield', field_name + '_lang_code_' + count);
			lang.setAttribute('completion', 'langue');
			lang.setAttribute('autocomplete', 'off');

			var del = document.createElement('button');
			del.setAttribute('class', 'bouton');
			del.setAttribute('type', 'button');
			del.innerHTML = '{{ msg.custom_fields_raz_button }}';
			del.addEventListener('click', function(){
				document.getElementById(field_name + '_lang_' + count).value=''; document.getElementById(field_name + '_lang_code_' + count).value=''; document.getElementById(field_name + "_" + count).value = '';
			}, false);

			var lang_code = document.createElement('input');
			lang_code.setAttribute('id', field_name + '_lang_code_' + count);
			lang_code.setAttribute('type', 'hidden');
			lang_code.setAttribute('value', "{% if custom_field.DEFAULT_LANG %}{{ custom_field.DEFAULT_LANG.value }}{% endif %}");
			lang_code.setAttribute('name', field_name + '_langs[' + count + ']');

			space=document.createElement('br');

			{% block add_additional_elements %}
			{% endblock %}

			let buttonAdd = document.getElementById('button_add_custom_text_i18n_{{ custom_field.NAME }}');

			document.getElementById('div_' + field_name).appendChild(text);
			document.getElementById('div_' + field_name).appendChild(lang);
			document.getElementById('div_' + field_name).appendChild(del);
			document.getElementById('div_' + field_name).appendChild(lang_code);

			if (buttonAdd) {
				document.getElementById('div_' + field_name).appendChild(buttonAdd);
            }

			document.getElementById('div_' + field_name).appendChild(space);

			document.getElementById('customfield_text_i18n_'+field_id).value = document.getElementById('customfield_text_i18n_'+field_id).value * 1 + 1;
			ajax_pack_element(lang);
		}
	</script>
{% endif %}
{% endblock %}