{% extends 'form_div_layout.html.twig' %}
{% use '@Lists/form/forms.html.twig' %}

{# https://github.com/symfony/symfony/blob/master/src/Symfony/Bridge/Twig/Resources/views/Form/form_div_layout.html.twig #}



{# Widgets #}

{%- block form_widget -%}

    {% if compound %}
        {{- block('form_widget_compound') -}}
    {% else %}
        {{- block('form_widget_simple') -}}
    {% endif %}

{%- endblock form_widget -%}


{# INPUT #}
{% block form_widget_simple -%}
    {%- set type = type|default('text') -%}
    {% set attr = attr|merge({class: (attr.class|default(' ') ~ ' oka-input')}) %}

    {% set isDropzone = attr['data-dropzone']|default(false)  %}
   

    {%- if type == 'range' or type == 'color' -%}
       {# Attribute "required" is not supported #}
       {%- set required = false -%}
    {%- endif -%}


    {%- if type == 'search'  -%}
        {% set attr = attr|merge({class: (attr.class|default(' ') ~ ' search')}) %}

        <div class="oka-field oka-field--search" data-controller="fieldsearch">
          
            <input type="{{ type }}" {{ block('widget_attributes') }} {% if value is not empty %}value="{{ value }}" {% endif %}  />

            <a href="javascript:void(0)" class="emptyField  oka-bt oka-bt--ghost oka-bt--rounded oka-bt--sm " data-action='fieldsearch#emptyPreviousInput' >
                <span class="oka-bt__ico">✕</span>
            </a>
        </div>
    {%- else -%}
        
        {%- if isDropzone   -%}
            
            {% set dz_id = attr['data-dz-id']|default(false)  %}
            {% set dz_url = attr['data-dz-url']|default(false)  %}
            {% set dz_default = attr['data-dz-default']|default(false)  %}

            <input type="{{ type }}" {{ block('widget_attributes') }} {% if value is not empty %}value="{{ value }}" {% endif %} />
            <div class="dropzone oka-dropzone" name="sessionimg" id="{{ dz_id }}" data-url="{{ dz_url }}"  data-filedefault="{{ dz_default }}" ></div>


        {%- else -%}
            <input type="{{ type }}" {{ block('widget_attributes') }} {% if value is not empty %}value="{{ value }}" {% endif %} />
        {%- endif -%}
    {%- endif -%}
    
    {# BOUTON affiche PASSWORD 
    {%- if type == 'password'  -%}
    <button type="button" class="oka-bt -ghost" onclick="showPass('{{ id }}')"><span class="oka-bt__ico material-icons">visibility</span></button>
    {%- endif -%}
    #}
    


{%- endblock form_widget_simple %}


{# SUBMIT #}
{% block submit_widget -%}
    {# %- set attr = attr|merge({class: (attr.class|default('btn-primary'))|trim}) -% #}
    {%- set attr = attr|merge({class: (attr.class|default('') ~ ' oka-bt -primary ')|trim}) -%}
    {#{- parent() -}#}
    <button type="{{ type|default('submit') }}" {{ block('button_attributes') }} >
        <span class="oka-bt__lbl">{{ label|trans({}, translation_domain) }}</span>
        <span class="oka-spinner"></span>
    </button>
{%- endblock submit_widget %}


{%- block textarea_widget -%}
    <textarea {{ block('widget_attributes') }}>{{ value }}</textarea>
{%- endblock textarea_widget -%}


{# INPUTS CHOICE : SELECT/RADIOS/CHECKBOXES  #}
{%- block choice_widget -%}
    {% if expanded %}
        {{- block('choice_widget_expanded') -}}
    {% else %}
        <!--collapsed (fields-oka.html.twig)-->
        {{- block('choice_widget_collapsed') -}}
    {% endif %}
{%- endblock choice_widget -%}




{# GROUPE DE INPUT RADIOS/CHECKBOXES  #}
{%- block choice_widget_expanded -%}
    {% if 'group-inline' in label_attr.class|default(' ') %}
        <div class="l-form-row__group--inline">
        {%- for child in form %}
            {{- form_widget(child) -}}
            {{- form_label(child, null, {translation_domain: choice_translation_domain}) -}}
        {% endfor -%}
        </div>
    {% else %}
        <div class="l-form-row__group">
        {%- for child in form %}
            {{- form_widget(child) -}}
            {{- form_label(child, null, {translation_domain: choice_translation_domain}) -}}
        {% endfor -%}
        </div>
    {% endif %}

{%- endblock choice_widget_expanded -%}

{# TIMETYPE (enleve les ":" entre minutes et secondes #}
{%- block time_widget -%}
    {%- if widget == 'single_text' -%}
        {{ block('form_widget_simple') }}
    {%- else -%}
        {%- set vars = widget == 'text' ? { 'attr': { 'size': 1 }} : {} -%}
        <div {{ block('widget_container_attributes') }}>
            {{ form_widget(form.hour, vars) }}{% if with_minutes %}{{ form_widget(form.minute, vars) }}{% endif %}{% if with_seconds %}{{ form_widget(form.second, vars) }}{% endif %}
        </div>
    {%- endif -%}
{%- endblock time_widget -%}

{# INPUT CHECKBOX  #}
{%- block checkbox_widget -%}

    {% set attr = attr|merge({class:attr.class|default(' ') ~ ' oka-checkbox'}) %}

    <input  type="checkbox" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />

{%- endblock checkbox_widget -%}



{# INPUT RADIO  #}
{%- block radio_widget -%}

    {% set attr = attr|merge({class:attr.class|default(' ') ~ ' oka-radio'}) %}

    <input type="radio" {{ block('widget_attributes') }} {% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />
{%- endblock radio_widget -%}



{# INPUT FILE  #}
 {%- block file_widget -%}

    {%- if required == 'true' or required == 'required' -%}

    {%- endif -%}
    {% set attr = attr|merge({class:attr.class|default(' ') ~ ' oka-inputfile'}) %}

    <input type="file" {{ block('widget_attributes') }}  />

    {# <label class="oka-input--file">
        <input type="file" {{ block('widget_attributes') }}  />

        <span class="label">
            <figure>
                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="17" viewBox="0 0 20 17"><path d="M10 0l-5.2 4.9h3.3v5.1h3.8v-5.1h3.3l-5.2-4.9zm9.3 11.5l-3.2-2.1h-2l3.4 2.6h-3.5c-.1 0-.2.1-.2.1l-.8 2.3h-6l-.8-2.2c-.1-.1-.1-.2-.2-.2h-3.6l3.4-2.6h-2l-3.2 2.1c-.4.3-.7 1-.6 1.5l.6 3.1c.1.5.7.9 1.2.9h16.3c.6 0 1.1-.4 1.3-.9l.6-3.1c.1-.5-.2-1.2-.7-1.5z"></path></svg>
            </figure>
            <span>Envoyer un fichier</span>
        </span>
    </label> #}


{%- endblock file_widget -%}




{# LABELS #}
{% block form_label -%}

    {% set label_attr = label_attr|merge({class: label_attr.class|default('')|replace({'hrz': ' oka-label--hrz ', 'group': '', 'group-inline': '' ,  'solo': ''}) ~ ' oka-label'|trim}) %}
   
   

    {% if errors|length > 0 -%}
        {% set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' error')|trim}) %}
    {% endif %}
    {{- parent() -}}

{%- endblock form_label %}





{# ROWS #}
{%- block form_row -%}
    {%- set widget_attr = {} -%}
    {%- set error = '' -%}
    {% if errors|length > 0 -%}
        {%  set error = 'l-form-row--invalide' %}
    {% endif %}

    {%- if help is not empty -%}
        {%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
    {%- endif -%}
    <!-- <div{% with {attr: row_attr} %}{{ block('attributes') }}{% endwith %}> -->


    {%- set group = '' -%}
    {% if 'group' in label_attr.class|default('') %}
        {%- set group = 'l-form-row-group' -%}
    {% endif %}

    {% if 'hrz' in label_attr.class|default('') %}
        {%- set class2 = 'l-form-row-hrz ' ~ group ~ error -%}
    {% else %}
        {%- set class2 = 'l-form-row ' ~ group ~ error -%}
    {% endif %}

     {# Ajoute class spécifique aux filtres #}
    {% set class2 = class2 ~ " " ~ (form.vars.attr.formRowType|default('')) %}

    {% if 'single-choice' in label_attr.class|default('') %}

        <div class="{{ class2 }}">
            {{- form_widget(form, widget_attr) -}}
            {{- form_label(form) -}}
            {{- form_errors(form) -}}
            {{- form_help(form) -}}
        </div>


    {% else %}

        <div class="{{ class2 }}">
            {{- form_label(form) -}}
            {{- form_widget(form, widget_attr) -}}
            {{- form_errors(form) -}}
            {{- form_help(form) -}}
        </div>

    {% endif %}


{%- endblock form_row -%}



{# https://github.com/symfony/twig-bridge/blob/master/Resources/views/Form/form_div_layout.html.twig #}
{%- block widget_attributes -%}
    id="{{ id }}" name="{{ full_name }}"
    {%- if disabled %} disabled="disabled"{% endif -%}
    {%- if required %} required="required"{% endif -%}
    {{ block('attributes') }}
{%- endblock widget_attributes -%}


{% block attributes -%}
    {%- for attrname, attrvalue in attr -%}
        {{- " " -}}
        {%- if attrname in ['placeholder', 'title'] -%}
            {{- attrname }}="{{ translation_domain is same as(false) ? attrvalue : attrvalue|trans(attr_translation_parameters, translation_domain) }}"
        {%- elseif attrvalue is same as(true) -%}
            {{- attrname }}="{{ attrname }}"
        {%- elseif attrvalue is not same as(false) -%}
            {{- attrname }}="{{ attrvalue }}"
        {%- endif -%}
    {%- endfor -%}
{%- endblock attributes -%}


{# Errors #}

{% block form_errors -%}
    {%- if errors|length > 0 -%}

        <span class="{% if form is not rootform %}js-alert js-HKH-champ__message--error{% else %}oka-message oka-message--error {% endif %}  ">
            {%- for error in errors -%}
                <!-- <span class="js-indic js-OKA-champ--error"></span> -->
                <span class="">
                    <span class="">{{ 'Error'|trans({}, 'validators') }}</span>
                    <span class="">{{ error.message }}</span>
                </span>
            {%- endfor -%}
        </span>

    {%- endif %}
{%- endblock form_errors %}