{% extends "layout.html" %}
{% block title %}Wet Processes - BEx{% endblock %}
{% block content %}
  <div class="container mt-5">
    <div class="text-center mb-4">
      <h1 class="display-5 title">Liste des conditions expérimentales</h1>
      <p class="lead">Sélectionner les conditions pour afficher les analyses associées.</p>
    </div>
    <div class="card shadow-sm">
      <div class="card-body">
        <h3 class="mb-4">Conditions disponibles</h3>
        <form id="wetForm" method="get" action="{{ request.path }}">
          <label for="wetSearch" class="form-label small text-muted mb-1">Filtrer les conditions</label>
          <input type="text"
                 id="wetSearch"
                 class="form-control mb-3"
                 placeholder="Rechercher un wet process..." />
          <div class="row">
            <div class="col-md-6">
              <div class="list-group" id="wetProcessList">
                {% for wet_process in wet_processes %}
                  <div class="list-group-item wet-process-item">
                    <div class="form-check">
                      <input class="form-check-input"
                             type="checkbox"
                             id="wet_{{ loop.index }}"
                             name="wet_processes"
                             value="{{ wet_process }}"
                             {% if wet_process in selected_wet_processes %}checked{% endif %} />
                      <label class="form-check-label" for="wet_{{ loop.index }}">{{ wet_process }}</label>
                    </div>
                  </div>
                {% endfor %}
              </div>
              <div class="d-flex gap-2 mt-3">
                <button type="button" class="reset-error-btn btn" id="resetWetSelection">Réinitialiser la sélection</button>
                <button type="button" class="btn" id="selectAllWet">Tout sélectionner</button>
              </div>
            </div>
            {% if selected_wet_processes %}
              <div class="col-md-6">
                {% if analyses %}
                  <h4 class="mt-4">Analyses associées :</h4>
                  <ul class="list-group mt-3">
                    {% for analysis in analyses %}
                      <li class="list-group-item">
                        <a href="{{ url_for('routes.show_analysis_detail', analysis_id=analysis, source='wet') }}"
                           class="text-decoration-none">
                          <div class="d-flex justify-content-between align-items-center">
                            <span>{{ analysis }}</span>
                            <i class="bi bi-chevron-right"></i>
                          </div>
                        </a>
                      </li>
                    {% endfor %}
                  </ul>
                {% else %}
                  <div class="alert alert-danger mt-4" role="alert">
                    <strong>Aucune analyse correspondante !</strong>
                    Aucun processus associé à ce Wet Process.
                  </div>
                {% endif %}
              </div>
            {% endif %}
          </div>
        </form>
      </div>
    </div>
  </div>
{% endblock %}
{% block page_js %}
  <script src="{{ url_for('static', filename='js/wet_processes.js') }}"></script>
{% endblock %}