{% use 'bootstrap_4_layout.html.twig' %}

{% block collection_widget %}
  {% set child = prototype %}
  {% set attr = attr|merge({class: (attr.class|default('') ~ ' js-collection-form')|trim}) %}

  <div {{ block('widget_container_attributes') }} data-prototype="{{ block('collection_entry_row')|e('html_attr') }}">
    <div class="js-collection-entries-container mb-2">
      {% for child in form %}
        <div class="js-collection-entry">
          {{ block('collection_entry_row') }}
        </div>
      {% endfor %}
    </div>

    {% if allow_add %}
      <div class="d-flex">
        <button type="button" class="js-add-collection-entry btn btn-outline-primary">
          <i class="material-icons">add_circle</i>
          {{ add_entry_label is defined ? add_entry_label : 'Add'|trans({}, 'Admin.Actions') }}
        </button>

        {% if max_count_message is defined %}
          <div class="js-max-collection-count-message alert alert-warning d-none d-print-none mb-0 ml-3">
            <div class="alert-text">
              {{ max_count_message }}
            </div>
          </div>
        {% endif %}
      </div>
    {% endif %}
  </div>
{% endblock %}

{%- block collection_entry_row -%}
  <div class="form-group p-3 border">
    {{ form_label(child) }}
    {{ form_widget(child, {'allow_delete': allow_delete}) }}
  </div>
{%- endblock -%}

{%- block integer_widget -%}
  {%- set type = type|default('number') -%}
  <div class="input-group">
    {{- block('form_widget_simple') -}}

    {% if form.vars.unit is defined %}
      <div class="input-group-append input-group-addon">
        <span class="input-group-text">{{ form.vars.unit }}</span>
      </div>
    {% endif %}
  </div>
{%- endblock integer_widget -%}

{% block form_label -%}
  {% if help is defined and help is not null %}
    <span class="d-flex align-items-baseline">
  {% endif %}

  {% if help is defined and help is not null and form.vars.compound %}
    {% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' w-auto')|trim}) %}
  {% endif %}

  {{- parent() -}}

  {% if help is defined and help is not null %}
    <span
        class="help-box mr-0 ml-2"
        data-toggle="popover"
        data-html="true"
        data-trigger="hover"
        data-placement="top"
        data-content="{{ help }}"
    ></span>
  {% endif %}

  {% if help is defined and help is not null %}
    </span>
  {% endif %}
{%- endblock form_label %}

{% block checkbox_widget -%}
  <div class="custom-control custom-checkbox">
    <input
      type="checkbox"
      class="custom-control-input"
      {{ block('widget_attributes') }}
      {% if value is defined %} value="{{ value }}"{% endif %}
      {% if checked %} checked="checked"{% endif %}
    >
    <span class="custom-control-indicator"></span>
    <label
      class="custom-control-label"
      for="{{ id }}"
    >
      {{ label }}

      {% if help is defined and help is not null %}
        <span
          class="help-box ml-1"
          data-toggle="popover"
          data-html="true"
          data-trigger="hover"
          data-placement="top"
          data-content="{{ help }}"
        >
        </span>
      {% endif %}
    </label>
  </div>
{%- endblock checkbox_widget %}

{% block shipping_options_row %}
  {% if label is not same as(false) %}
    <label class="h3 mb-3" for="{{ form.vars.id }}">
      {{ label }}
    </label>
  {% endif %}

  {{ form_errors(form) }}
  {{ form_rest(form) }}
{% endblock %}

{% block carrier_mappings_row %}
  <div class="row mt-n2 align-items-end">
    {% for child in form %}
      <div class="col-xl-3 col-md-6 col-12 col-xs-12 mt-2">
        {{ form_row(child) }}
      </div>
    {% endfor %}
  </div>
{% endblock %}

{% block service_options_row %}
  {% if label is not same as(false) %}
    <label class="h4" for="{{ form.vars.id }}">
      {{ label }}
    </label>
  {% endif %}

  <div class="row mt-n2">
    <div class="col-xl-4 col-md-6 col-12 col-xs-12 mt-2">
      {{ form_row(form.additionalCost) }}
    </div>
    <div class="offset-xl-0 offset-6"></div>

    {{ form_rest(form) }}
  </div>
{% endblock %}

{% block time_of_week_range_row %}
  {{ form_rest(form) }}
{% endblock %}

{% block time_of_week_row %}
  <div class="col-xl-4 col-md-6 col-12 col-xs-12 mt-2">
    <fieldset class="form-group">
      {{ form_label(form, null, {'compound': false }) }}

      <div class="row row-flex mx-n1">
        <div class="col-xs-12 col col-sm px-1">
          {{ form_widget(form.weekDay) }}
          {{ form_errors(form.weekDay) }}
        </div>
        <div class="col-xs-12 col col-sm px-1">
          {{ form_widget(form.time) }}
          {{ form_errors(form.time) }}
        </div>

        {{ form_rest(form) }}
      </div>
    </fieldset>
  </div>
{% endblock %}

{% block form_help %}{% endblock %}

{% block inpostizi_translatable_widget -%}
  {% set formClass = form.vars.attr.class|default('') ~ ' input-group locale-input-group js-locale-input-group d-flex'|trim %}
  <div class="{{ formClass }}">
    {% for translateField in form %}
      {% set classes = translateField.vars.attr.class|default('') ~ ' js-locale-input'%}
      {% set classes = classes ~ ' js-locale-' ~ translateField.vars.label %}
      {% if default_locale.id_lang != translateField.vars.name %}
        {% set classes = classes ~ ' d-none' %}
      {% endif %}
      <div class="{{ classes }}" style="flex-grow: 1;">
        {{ form_widget(translateField, {'attr': {'class': translateField.vars.attr.class|default('') ~ ' w-100'}}) }}
      </div>
    {% endfor %}
    {% if not hide_locales %}
      <div class="dropdown ml-2">
        <button class="btn btn-outline-secondary dropdown-toggle js-locale-btn"
                type="button"
                data-toggle="dropdown"
                aria-haspopup="true"
                aria-expanded="false"
                id="{{ form.vars.id }}_dropdown"
        >
          {{ form.vars.default_locale.iso_code }}
        </button>
        <div class="dropdown-menu dropdown-menu-right locale-dropdown-menu" aria-labelledby="{{ form.vars.id }}_dropdown">
          {% for locale in locales %}
            <span class="dropdown-item js-locale-item" data-locale="{{ locale.iso_code }}">{{ locale.name }}</span>
          {% endfor %}
        </div>
      </div>
    {% endif %}
  </div>
{%- endblock inpostizi_translatable_widget %}

{% block inpostizi_switch_widget %}
  <span class="ps-switch">
    {% for choice in choices %}
      {% set inputId = id ~'_' ~ choice.value %}
      <input id="{{inputId}}"
          {{ block('attributes') }}
          name="{{ full_name }}"
          value="{{ choice.value }}"
          {% if choice is selectedchoice(value) %}checked=""{% endif %}
          {% if disabled %}disabled=""{% endif %}
          type="radio"
          aria-label="{{ choice.label|trans({}, choice_translation_domain) }}"
      >
      <label for="{{inputId}}">{{ choice.label|trans({}, choice_translation_domain) }}</label>
    {% endfor %}
    <span class="slide-button"></span>
  </span>
{% endblock inpostizi_switch_widget %}

{% block inpostizi_category_choice_tree_widget %}
  <div class="inpostizi-material-choice-tree-container js-choice-tree-container{% if required %} required{% endif %}" id="{{ form.vars.id }}">
    <div class="choice-tree-actions">
      <span class="form-control-label js-toggle-choice-tree-action"
            data-expanded-text="{{ 'Expand'|trans({}, 'Admin.Actions') }}"
            data-expanded-icon="expand_more"
            data-collapsed-text="{{ 'Collapse'|trans({}, 'Admin.Actions') }}"
            data-collapsed-icon="expand_less"
            data-action="expand"
      >
        <i class="material-icons">expand_more</i>
        <span class="js-toggle-text">{{ 'Expand'|trans({}, 'Admin.Actions') }}</span>
      </span>
    </div>

    <ul class="choice-tree">
      {% for choice in choices_tree %}
        {{ block('inpostizi_category_choice_tree_item_widget') }}
      {% endfor %}
    </ul>
  </div>
{% endblock inpostizi_category_choice_tree_widget %}

{% block inpostizi_category_choice_tree_item_widget %}
  {% set has_children = choice[choice_children] is defined %}

  <li class="{% if choice.has_selected_children %}expanded{% elseif has_children %}collapsed{% endif %}">
    {% if multiple %}
      {{ block('inpostizi_category_choice_tree_item_checkbox_widget') }}
    {% else %}
      {{ block('inpostizi_category_choice_tree_item_radio_widget') }}
    {% endif %}

    {% if has_children %}
      <ul>
        {% for item in choice[choice_children] %}
          {% set choice = item %}
          {{ block('inpostizi_category_choice_tree_item_widget') }}
        {% endfor %}
      </ul>
    {% endif %}
  </li>
{% endblock inpostizi_category_choice_tree_item_widget %}

{% block inpostizi_category_choice_tree_item_checkbox_widget %}
  <div class="checkbox js-input-wrapper">
    <div class="md-checkbox md-checkbox-inline">
      <label>
        <input type="checkbox"
            {% if choice[choice_value] is not null %}
              name="{{ form.vars.full_name }}[]"
              value="{{ choice[choice_value] }}"
              {% if choice[choice_value] in selected_values %}checked{% endif %}
            {% endif %}
            {% if disabled or choice[choice_value] in disabled_values %}disabled{% endif %}
        >
        <i class="md-checkbox-control"></i>
        {{ choice[choice_label] }}
      </label>
    </div>
  </div>
{% endblock inpostizi_category_choice_tree_item_checkbox_widget %}

{% block inpostizi_category_choice_tree_item_radio_widget %}
  <div class="radio js-input-wrapper form-check form-check-radio">
    <label class="form-check-label">
      <input type="radio"
             name="{{ form.vars.full_name }}"
             value="{{ choice[choice_value] }}"
             {% if choice[choice_value] in selected_values %}checked{% endif %}
          {% if disabled or choice[choice_value] in disabled_values %}disabled{% endif %}
          {% if required %}required{% endif %}
      >
      <i class="form-check-round"></i>
      {{ choice[choice_label] }}
    </label>
  </div>
{% endblock inpostizi_category_choice_tree_item_radio_widget %}

{% block widget_display_configuration_row %}
  <div class="card-body panel-body form-wrapper px-sm-4 px-3 pt-4 pb-3">
    {% include '@Modules/inpostizi/views/templates/admin/config/gui/form.html.twig' with {
      form: form,
    } %}
  </div>
{% endblock widget_display_configuration_row %}

{% block product_page_display_configuration_row %}
  {{ form_rest(form) }}
{% endblock product_page_display_configuration_row %}

{% block product_restrictions_row %}
  <div class="card-body panel-body form-wrapper px-sm-4 px-3 pt-4 pb-3">
    <p class="h3 mb-3">
      {{ form_label(form, null, {
        'label_attr': {
          'class': 'p-0'
        }
      }) }}
    </p>

    <div class="row row-flex mt-n3">
      <div class="col-lg-5 col-md-6 col-12 col-xs-12 mt-3">
        {{ form_row((form.blockOrder)) }}
        {{ form_row(form.productTypes) }}
        {{ form_row(form.manufacturerIds) }}
        {{ form_row(form.attributeGroupIds) }}
        {{ form_row(form.featureIds) }}
      </div>
      <div class="col-lg-7 col-md-6 col-12 col-xs-12 mt-3 mr-auto">
        {{ form_row(form.categoryIds) }}
      </div>
    </div>

    {{ form_rest(form) }}
  </div>
{% endblock product_restrictions_row %}

{% block choice_widget %}
  {% if expanded and multiple %}
    <div class="dropdown" data-prevent-close-on-inside-click="true">
      <button
          class="btn btn-outline-secondary dropdown-toggle"
          type="button"
          id="{{ form.vars.id }}_dropdown"
          data-toggle="dropdown"
          aria-haspopup="true"
          aria-expanded="false"
      >
        {{ 'Select options from list'|legacy_trans }}
      </button>
      <div class="dropdown-menu inpostizi-checkboxes-options" aria-labelledby="{{ form.vars.id }}_dropdown">
        {% set allChecked = true %}

        {% for child in form.children %}
          {% if child.vars.checked is defined and child.vars.checked is not null %}
            {% set allChecked = allChecked and child.vars.checked %}
          {% endif %}
        {% endfor %}

        <div class="custom-control custom-checkbox border-0">
          <input type="checkbox"
                 class="custom-control-input js-inpostizi-accept-all-options-checkbox"
                 id="{{ form.vars.id }}_all"
                 name="{{ form.vars.id }}_all"
                 data-target="{{ form.vars.full_name }}[]"
                 value="1"
                 {% if allChecked %}checked{% endif %}
          >
          <span class="custom-control-indicator"></span>
          <label class="custom-control-label" for="{{ form.vars.id }}_all">
            <strong>
              {{ 'Select all options'|legacy_trans }}
            </strong>
          </label>
        </div>

        {{ parent() }}
      </div>
    </div>
  {% else %}
    {{ parent() }}
  {% endif %}
{% endblock choice_widget %}

{% block consent_widget %}
  <div class="row d-flex mb-3">
    <div class="col-xs-8 col-8 mt-auto">
      <div class="d-flex">
        {{ form_label(form.descriptions, null, {
          'label_attr': {
            'class': 'p-0 mb-2 d-inline'
          }
        }) }}
      </div>

      {{ form_widget(form.descriptions) }}
    </div>

    <div class="col-xs-3 col-3 mt-auto">
      {{ form_label(form.requirementType, null, {
        'label_attr': {
          'class': 'p-0 mb-2'
        }
      }) }}

      {{ form_widget(form.requirementType) }}
    </div>

    {% if allow_delete is defined and allow_delete %}
      <div class="col-xs-1 col-1 mt-auto text-right">
        <button type="button" class="js-remove-collection-entry btn btn-outline-secondary">
          <i class="material-icons">remove_circle</i>
          {{ 'Remove'|trans({}, 'Admin.Actions') }}
        </button>
      </div>
    {% endif %}
  </div>

  {{ form_label(form.additionalLinks, null, {
    'label_attr': {
      'class': 'h4'
    }
  }) }}

  {{ form_row(form.link) }}
  {{ form_widget(form.additionalLinks) }}

  {{ form_rest(form) }}
{% endblock %}

{% block consent_link_widget %}
  <div class="row d-flex mb-3">
    <div class="col-xs-3 col-3 mt-auto">
      {{ form_label(form.id, null, {
        'label_attr': {
          'class': 'p-0 mb-2'
        }
      }) }}

      {{ form_widget(form.id) }}
    </div>

    <div class="col-xs-3 col-3 mt-auto">
      {{ form_label(form.cmsPageId, null, {
        'label_attr': {
          'class': 'p-0 mb-2'
        }
      }) }}

      {{ form_widget(form.cmsPageId) }}
    </div>

    <div class="col-xs-5 col-5 mt-auto">
      <div class="d-flex">
        {{ form_label(form.labels, null, {
          'label_attr': {
            'class': 'p-0 mb-2 d-inline'
          }
        }) }}
      </div>

      {{ form_widget(form.labels) }}
    </div>

    {% if allow_delete is defined and allow_delete %}
      <div class="col-xs-1 col-1 mt-auto text-right">
        <button type="button" class="js-remove-collection-entry btn btn-outline-secondary">
          <i class="material-icons">remove_circle</i>
          {{ 'Remove'|trans({}, 'Admin.Actions') }}
        </button>
      </div>
    {% endif %}

    {{ form_rest(form) }}
  </div>
{% endblock %}