{% extends "base.html" %}
{% load humanize %}
{% load naturalduration %}

{% block content %}
<main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
        <h1 class="h2">All Scrobbles</h1>
    </div>

    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
                <tr>
                    <th scope="col">Date</th>
                    <th scope="col">Type</th>
                    <th scope="col">Title</th>
                    <th scope="col">Time</th>
                </tr>
            </thead>
            <tbody>
                {% for scrobble in object_list %}
                <tr>
                    <td><a href="{{scrobble.get_absolute_url}}">{{ scrobble.timestamp|naturaltime }}</a></td>
                    <td>{{ scrobble.get_media_type_display }}</td>
                    <td>
                        {% if scrobble.video %}
                        <a href="{% url 'videos:video_detail' scrobble.video.uuid %}">{{ scrobble.video.title }}</a>
                        {% elif scrobble.track %}
                        <a href="{% url 'music:track_detail' scrobble.track.uuid %}">{{ scrobble.track.title }}</a>
                        {% elif scrobble.video_game %}
                        <a href="{% url 'videogames:videogame_detail' scrobble.video_game.uuid %}">{{ scrobble.video_game.name }}</a>
                        {% elif scrobble.book %}
                        <a href="{% url 'books:book_detail' scrobble.book.uuid %}">{{ scrobble.book.title }}</a>
                        {% elif scrobble.food %}
                        <a href="{% url 'foods:food_detail' scrobble.food.uuid %}">{{ scrobble.food.title }}</a>
                        {% elif scrobble.beer %}
                        <a href="{% url 'beers:beer_detail' scrobble.beer.uuid %}">{{ scrobble.beer.title }}</a>
                        {% elif scrobble.web_page %}
                        <a href="{% url 'webpages:webpage_detail' scrobble.web_page.uuid %}">{{ scrobble.web_page.title }}</a>
                        {% elif scrobble.podcast_episode %}
                        <a href="{% url 'podcasts:podcast_detail' scrobble.podcast_episode.podcast.id %}">{{ scrobble.podcast_episode.title }}</a>
                        {% elif scrobble.board_game %}
                        <a href="{% url 'boardgames:boardgame_detail' scrobble.board_game.uuid %}">{{ scrobble.board_game.name }}</a>
                        {% elif scrobble.trail %}
                        <a href="{% url 'trails:trail_detail' scrobble.trail.uuid %}">{{ scrobble.trail.name }}</a>
                        {% elif scrobble.puzzle %}
                        <a href="{% url 'puzzles:puzzle_detail' scrobble.puzzle.uuid %}">{{ scrobble.puzzle.name }}</a>
                        {% elif scrobble.brick_set %}
                        <a href="{% url 'bricksets:brickset_detail' scrobble.brick_set.set_num %}">{{ scrobble.brick_set.name }}</a>
                        {% elif scrobble.task %}
                        <a href="{% url 'tasks:task_detail' scrobble.task.id %}">{{ scrobble.task.title }}</a>
                        {% elif scrobble.life_event %}
                        <a href="{% url 'lifeevents:lifeevent_detail' scrobble.life_event.uuid %}">{{ scrobble.life_event.title }}</a>
                        {% elif scrobble.mood %}
                        <a href="{% url 'moods:mood_detail' scrobble.mood.id %}">{{ scrobble.mood.name }}</a>
                        {% elif scrobble.geo_location %}
                        <a href="{% url 'locations:geolocation_detail' scrobble.geo_location.uuid %}">{{ scrobble.geo_location.name }}</a>
                        {% else %}
                        Unknown
                        {% endif %}
                    </td>
                    <td>
                        {% if scrobble.playback_position_seconds %}
                        {{ scrobble.playback_position_seconds|natural_duration }}
                        {% endif %}
                    </td>
                </tr>
                {% empty %}
                <tr>
                    <td colspan="4">No scrobbles found.</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

    {% if page_obj.has_previous or page_obj.has_next %}
    <nav>
        <ul class="pagination">
            {% if page_obj.has_previous %}
            <li class="page-item"><a class="page-link" href="?page={{ page_obj.previous_page_number }}{% if tags_param %}&tags={{ tags_param }}{% endif %}">Previous</a></li>
            {% endif %}
            <li class="page-item"><span class="page-link">Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}</span></li>
            {% if page_obj.has_next %}
            <li class="page-item"><a class="page-link" href="?page={{ page_obj.next_page_number }}{% if tags_param %}&tags={{ tags_param }}{% endif %}">Next</a></li>
            {% endif %}
        </ul>
    </nav>
    {% endif %}
</main>
{% endblock %}