{% extends '@PrestaShop/Admin/layout.html.twig' %}

{% block content %}
<div class="row content">
  {% include '@Modules/polarisprestatheme/views/templates/admin/nav.html.twig' %}

  <div data-token="{{token}}" class="container-admin">
    <div class="header">
      <h3 class="card-header-title">{{ title }}</h3>
      <p class="intro-form">{{ intro|raw }}</p>
    </div>
     
    <div class="container-content">
      {{ form_start(form, {'attr': {'enctype': 'multipart/form-data'}}) }}

        {# Bloc spécial pour collection d'images avec titre + URL #}
        {% if form.medias is defined %}
          
          {{ form_widget(form) }}
          <button type="button" id="add-media" class="btn btn-primary mt-3"
            {% if form.medias|length >= 3 %}disabled{% endif %}>
            Ajouter une image
          </button>

        {% elseif form.stores is defined %}

          {{ form_widget(form) }}
          <button type="button" id="add-store" class="btn btn-primary mt-3"
            {% if form.stores|length >= 3 %}disabled{% endif %}>
            Ajouter un magasin
          </button>

        {% else %}
          {# Tous les autres champs du formulaire #}
          {{ form_widget(form) }}
        {% endif %}
      
        {# Affichage de l'image de configuration si elle existe #}
        {% if mediaImages is defined %}
          {% for index, image in mediaImages %}
            <img class="img-form" data-index="{{ loop.index0 }}" src="{{ image }}" />
          {% endfor %}
        {% endif %}
        {# Affichage de l'image de configuration principale #}
        {% if configImage %}
          <img class="img-form"  src="{{configImage}}" />
        {% endif %}


      {{ form_end(form) }}
    </div>
  </div>
</div>

{% if app.request.attributes.get('_route') == "admin_presta_about" %}
<script>
 $(document).ready(function () {
    // Learn more about components in documentation
    // https://devdocs.prestashop.com/1.7/development/components/global-components/
    window.prestashop.component.initComponents(
        [
            'TinyMCEEditor',   
        ],
    );
});
</script>
{% endif %}


{% endblock %}

{% block javascripts %}
<script src="{{url}}modules/polarisprestatheme/views/js/form.js"></script>
{% endblock %}