{% extends "base.html" %}

{% block title %}{{ 'attendees'|t }} - NetEvents{% endblock %}

{% block content %}
<div class="attendees-page">
    <h1>{{ 'event_attendees'|t }}</h1>
    <p>{{ 'connect_with_attendees'|t }}</p>

    {% if attendees %}
        <div class="attendees-grid">
            {% for att in attendees %}
                <div class="attendee-card">
                    <div class="attendee-photo">
                        {% if att.profile_picture %}
                            <img src="{{ url_for('static', filename='uploads/' + att.profile_picture) }}" alt="Photo">
                        {% else %}
                            <div class="no-photo">{{ att.first_name[0] }}{{ att.last_name[0] }}</div>
                        {% endif %}
                    </div>
                    <div class="attendee-info">
                        <h3>{{ att.first_name }} {{ att.last_name }}</h3>
                        <p class="attendee-org">{{ (att.organisation)|spacify if att.organisation else '' }}</p>
                        <p class="attendee-role">{{ (att.role)|spacify if att.role else '' }}</p>
                        {% if att.introduction %}
                            <p class="attendee-intro">{{ att.introduction[:100] }}{% if att.introduction|length > 100 %}...{% endif %}</p>
                        {% endif %}
                    </div>
                    <div class="attendee-actions">
                        {% if att.my_status == 'accepted' %}
                            <span class="badge badge-success">{{ 'connected'|t }}</span>
                        {% elif att.my_status == 'pending' %}
                            <span class="badge badge-pending">{{ 'request_pending'|t }}</span>
                        {% elif att.my_status == 'rejected' %}
                            <span class="badge badge-rejected">{{ 'rejected'|t }}</span>
                        {% else %}
                            <form method="POST" action="{{ url_for('create_connection') }}" class="connect-form">
                                <input type="hidden" name="connected_attendee_id" value="{{ att.id }}">
                                <button type="submit" class="btn btn-sm btn-primary">{{ 'connect'|t }}</button>
                            </form>
                        {% endif %}
                    </div>
                </div>
            {% endfor %}
        </div>
    {% else %}
        <p class="no-attendees">{{ 'no_other_attendees'|t }}</p>
    {% endif %}
</div>
{% endblock %}