{% extends 'layout.twig' %}

{% block body %}
<section class="contenu clearfix"  id="commandes">
	<h1>
        {{ 'Format' | trad }}
	</h1>
		
    {{ ariane() }}

        <div class="content">

            <form name="form_format" id="form_format">

                <h1>
                    {{ 'Création d\'un format' | trad }}
                    <button class="principal button" type="button"
                            onClick="ajaxPopupV2('{{ path('Catalogue.Format.validate') }}', 'form_format');"
                    >
                        {{ 'Enregistrer' |trad }}
                    </button>
                    {{ arianeAnnuler() }}
                </h1>

                <div class="box-form clearfix">
                    <div class="clearfix">
                        <div class="colonne2">
                            <div class="row">
                                {{ inputAdvance('TEXT',{
                                    'titre' : 'Identification du format' | trad,
                                    'name' : 'IDFORMAT',
                                    'value' : format.IDFORMAT,
                                    'pathValidator' : path('Ajax.validator.isStringSansEspace'),
                                    'paramsValidator' : "{'sizeMin' : '1', 'sizeMax' : '30'}",
                                    'obligatoire' : true,
                                    'inputAttr' : {
                                        'oninput' : 'this.value = this.value.toUpperCase()',
                                    },
                                }) }}
                            </div>
                            <div class="row">
                                {{ inputAdvance('SELECT', {
                                    'name' : 'TYPDATAS',
                                    'value' : format.TYPDATAS,
                                    'titre' : 'Type de structure' | trad,
                                    'listeValue' : typeFormat,
                                }) }}
                            </div>
                            <div class="row typeData RACINEXML_cXML" {% if format.TYPDATAS == 'cXML' %}{% else %}style="display:none;"{% endif %}>
                                {{ inputAdvance('select',{
                                    'titre' : 'Encoding' | trad,
                                    'name' : 'ENCODING',
                                    'listeValue' : {'' : 'Normal' |  trad, '1': 'Base 64' | trad},
                                    'value' : format.ENCODING,
                                }) }}
                            </div>
                        </div>
                        <div class="colonne2 last">
                            <div class="row">
                                {{ inputAdvance('TEXT',{
                                    'titre' : 'Description du format' | trad,
                                    'name' : 'DESCFRMT',
                                    'value' : format.DESCFRMT,
                                    'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                    'paramsValidator' : "{'sizeMin' : '1', 'sizeMax' : '128'}",
                                    'obligatoire' : true,
                                }) }}
                            </div>
                            <div class="row typeData RACINEXML_cXML" {% if format.TYPDATAS == 'cXML' %}{% else %}style="display:none;"{% endif %}>
                                {{ inputAdvance('TEXT',{
                                    'titre' : 'Identifiant panier fournisseur' | trad,
                                    'name' : 'RACINEXML_CXML',
                                    'value' : format.RACINEXML,
                                    'pathValidator' : path('Ajax.validator.isStringSansEspace'),
                                    'paramsValidator' : "{'sizeMin' : '0', 'sizeMax' : '128'}",
                                }) }}
                            </div>
                            <div class="row typeData RACINEXML_OCI" {% if format.TYPDATAS == 'OCI' %}{% else %}style="display:none;"{% endif %}>
                                {{ inputAdvance('TEXT',{
                                    'titre' : 'Identifiant panier fournisseur' | trad,
                                    'name' : 'RACINEXML_OCI',
                                    'value' : format.RACINEXML,
                                    'pathValidator' : path('Ajax.validator.isStringSansEspace'),
                                    'paramsValidator' : "{'sizeMin' : '0', 'sizeMax' : '128'}",
                                }) }}
                            </div>
                        </div>
                    </div>

                    <div class="clearfix typeData RACINEXML_OCI RACINEXML_cXML" {% if format.TYPDATAS == 'cXML' or format.TYPDATAS == 'OCI' %}{% else %}style="display:none;"{% endif %}>
                        <h4> {{ 'Paramétrage connecteur' | trad }} </h4>
                        
                        {% include '@catalogue/Format/_ParametrageConnecteur.twig' %}
                    </div>
                </div>
            </form>
        </div>
        <script>
            document.addEventListener('change',(event) => {
                var target = event.target;

                if (!(target instanceof HTMLElement) ) {
                    return;
                }

                if ($(target).attr('id') != 'input_TYPDATAS') {
                    return;
                }

                var value = $(target).val();

                $('.typeData').hide();
                $('.RACINEXML_'+value).show();
            });
        </script>

</section>
{% endblock %}