{% extends "base.html" %}
{% block title %}Papers{% endblock %}
{% block content %}

{# --- Sort direction logic for each column --- #}
{% set title_sort = 'asc' if sort_by != 'title' or sort_dir == 'desc' else 'desc' %}
{% set journal_sort = 'asc' if sort_by != 'journal' or sort_dir == 'desc' else 'desc' %}
{% set doi_sort = 'asc' if sort_by != 'doi' or sort_dir == 'desc' else 'desc' %}
{% set issn_sort = 'asc' if sort_by != 'issn' or sort_dir == 'desc' else 'desc' %}
{% set status_sort = 'asc' if sort_by != 'status' or sort_dir == 'desc' else 'desc' %}
{% set created_sort = 'asc' if sort_by != 'created_at' or sort_dir == 'desc' else 'desc' %}
{% set updated_sort = 'asc' if sort_by != 'updated_at' or sort_dir == 'desc' else 'desc' %}

<form method="get" class="mb-4 row g-3">
    <div class="col-md-2">
        <label>Status</label>
        <select name="status" class="form-select">
            <option value="">All</option>
            {% if request.args.get('status') == 'Pending' %}
                <option value="Pending" selected>Pending</option>
            {% else %}
                <option value="Pending">Pending</option>
            {% endif %}
            
            {% if request.args.get('status') == 'Done' %}
                <option value="Done" selected>Done</option>
            {% else %}
                <option value="Done">Done</option>
            {% endif %}
            
            {% if request.args.get('status') == 'Failed' %}
                <option value="Failed" selected>Failed</option>
            {% else %}
                <option value="Failed">Failed</option>
            {% endif %}
        </select>
    </div>
    <div class="col-md-2">
        <label>Created from</label>
        <input type="date" name="created_from" class="form-control" value="{{ request.args.get('created_from', '') }}">
    </div>
    <div class="col-md-2">
        <label>Created to</label>
        <input type="date" name="created_to" class="form-control" value="{{ request.args.get('created_to', '') }}">
    </div>
    <div class="col-md-2">
        <label>Updated from</label>
        <input type="date" name="updated_from" class="form-control" value="{{ request.args.get('updated_from', '') }}">
    </div>
    <div class="col-md-2">
        <label>Updated to</label>
        <input type="date" name="updated_to" class="form-control" value="{{ request.args.get('updated_to', '') }}">
    </div>
    <div class="col-md-2 d-flex align-items-end">
        <button type="submit" class="btn btn-primary w-100">Filter</button>
    </div>
</form>

<div class="modal fade" id="paperDetailModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <div class="modal-content" id="paper-detail-content">
            <!-- AJAX-loaded content will go here -->
        </div>
    </div>
</div>

<div class="d-flex align-items-center mb-4">
    <!-- Statistics Section -->
    <div class="me-auto">
        <div class="list-group list-group-horizontal">
            <div class="list-group-item d-flex justify-content-between align-items-center">
                <strong>Total Papers</strong>
                <span class="badge bg-primary rounded-pill">{{ total_papers }}</span>
            </div>
            {% for status, count in status_counts.items() %}
                <div class="list-group-item d-flex justify-content-between align-items-center">
                    <strong>{{ status }}:</strong>
                    <span class="badge bg-primary rounded-pill">{{ count }}</span>
                </div>
            {% endfor %}
        </div>
    </div>

    <!-- Pagination Section -->
    <nav aria-label="Page navigation" class="mx-auto">
        <ul class="pagination justify-content-center mb-0">
            {% if pagination.has_prev %}
            <li class="page-item">
                {% set params = request.args.to_dict() %}
                {% set _ = params.pop('page', None) %}
                <a class="page-link" href="{{ url_for('main.list_papers', page=pagination.prev_num, **params) }}" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>
            {% else %}
            <li class="page-item disabled">
                <span class="page-link" aria-hidden="true">&laquo;</span>
            </li>
            {% endif %}

            {% for page_num in pagination.iter_pages(left_edge=2, right_edge=2, left_current=2, right_current=2) %}
            {% if page_num %}
            <li class="page-item {% if page_num == pagination.page %}active{% endif %}">
                {% set params = request.args.to_dict() %}
                {% set _ = params.pop('page', None) %}
                <a class="page-link" href="{{ url_for('main.list_papers', page=page_num, **params) }}">{{ page_num }}</a>
            </li>
            {% else %}
            <li class="page-item disabled"><span class="page-link">…</span></li>
            {% endif %}
            {% endfor %}

            {% if pagination.has_next %}
            <li class="page-item">
                {% set params = request.args.to_dict() %}
                {% set _ = params.pop('page', None) %}
                <a class="page-link" href="{{ url_for('main.list_papers', page=pagination.next_num, **params) }}" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
            {% else %}
            <li class="page-item disabled">
                <span class="page-link" aria-hidden="true">&raquo;</span>
            </li>
            {% endif %}
        </ul>
    </nav>

    <!-- Buttons Section -->
    <div class="ms-auto">
        <a href="{{ url_for('main.export_papers') }}" class="btn btn-outline-secondary">Export CSV</a>
    </div>
</div>
    <table class="table table-striped table-bordered table-smaller">
        <thead>
            <tr>
                <th>
                    {% set params = request.args.to_dict() %}
                    {% set params = params.update({'sort_by': 'title', 'sort_dir': title_sort}) or params %}
                    <a href="{{ url_for('main.list_papers', **params) }}">Title</a>
                </th>
                <th>
                    {% set params = request.args.to_dict() %}
                    {% set params = params.update({'sort_by': 'journal', 'sort_dir': journal_sort}) or params %}
                    <a href="{{ url_for('main.list_papers', **params) }}">Journal</a>
                </th>
                <th>
                    {% set params = request.args.to_dict() %}
                    {% set params = params.update({'sort_by': 'doi', 'sort_dir': doi_sort}) or params %}
                    <a href="{{ url_for('main.list_papers', **params) }}">DOI</a>
                </th>
                <th>
                    {% set params = request.args.to_dict() %}
                    {% set params = params.update({'sort_by': 'issn', 'sort_dir': issn_sort}) or params %}
                    <a href="{{ url_for('main.list_papers', **params) }}">ISSN</a>
                </th>
                <th>
                    {% set params = request.args.to_dict() %}
                    {% set params = params.update({'sort_by': 'status', 'sort_dir': status_sort}) or params %}
                    <a href="{{ url_for('main.list_papers', **params) }}">Status</a>
                </th>
                <th>
                    {% set params = request.args.to_dict() %}
                    {% set params = params.update({'sort_by': 'created_at', 'sort_dir': created_sort}) or params %}
                    <a href="{{ url_for('main.list_papers', **params) }}">Created</a>
                </th>
                <th>
                    {% set params = request.args.to_dict() %}
                    {% set params = params.update({'sort_by': 'updated_at', 'sort_dir': updated_sort}) or params %}
                    <a href="{{ url_for('main.list_papers', **params) }}">Updated</a>
                </th>
            </tr>
        </thead>
        <tbody>
            {% for paper in papers %}
            <tr>
                <td><a href="#" class="paper-link" data-url="{{ url_for('main.paper_detail', paper_id=paper.id) }}">{{ paper.title }}</a></td>
                <td>{{ paper.journal }}</td>
                <td>{{ paper.doi }}</td>
                <td>{{ paper.issn }}</td>
                <td>{{ paper.status }}</td>
                <td>{{ paper.created_at.strftime('%Y-%m-%d %H:%M:%S') }}</td>
                <td>{{ paper.updated_at.strftime('%Y-%m-%d %H:%M:%S') }}</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>

<nav aria-label="Page navigation">
    <ul class="pagination justify-content-center">
        {% if pagination.has_prev %}
        <li class="page-item">
            {% set params = request.args.to_dict() %}
            {% set _ = params.pop('page', None) %}
            <a class="page-link" href="{{ url_for('main.list_papers', page=pagination.prev_num, **params) }}" aria-label="Previous">
                <span aria-hidden="true">&laquo;</span>
            </a>
        </li>
        {% else %}
        <li class="page-item disabled">
            <span class="page-link" aria-hidden="true">&laquo;</span>
        </li>
        {% endif %}

        {% for page_num in pagination.iter_pages(left_edge=2, right_edge=2, left_current=2, right_current=2) %}
        {% if page_num %}
        <li class="page-item {% if page_num == pagination.page %}active{% endif %}">
            {% set params = request.args.to_dict() %}
            {% set _ = params.pop('page', None) %}
            <a class="page-link" href="{{ url_for('main.list_papers', page=page_num, **params) }}">{{ page_num }}</a>
        </li>
        {% else %}
        <li class="page-item disabled"><span class="page-link">…</span></li>
        {% endif %}
        {% endfor %}

        {% if pagination.has_next %}
        <li class="page-item">
            {% set params = request.args.to_dict() %}
            {% set _ = params.pop('page', None) %}
            <a class="page-link" href="{{ url_for('main.list_papers', page=pagination.next_num, **params) }}" aria-label="Next">
                <span aria-hidden="true">&raquo;</span>
            </a>
        </li>
        {% else %}
        <li class="page-item disabled">
            <span class="page-link" aria-hidden="true">&raquo;</span>
        </li>
        {% endif %}
    </ul>
</nav>

<script>
document.addEventListener("DOMContentLoaded", function () {
    const modal = new bootstrap.Modal(document.getElementById('paperDetailModal'));
    const content = document.getElementById('paper-detail-content');

    document.querySelectorAll('.paper-link').forEach(link => {
        link.addEventListener('click', function (e) {
            e.preventDefault();
            const url = this.getAttribute('data-url');

            fetch(url)
                .then(response => response.text())
                .then(html => {
                    content.innerHTML = html;
                    modal.show();
                })
                .catch(err => {
                    content.innerHTML = '<div class="modal-body text-danger">Error loading details.</div>';
                    modal.show();
                });
        });
    });
});
</script>
{% endblock %}