{% extends "base.html" %}
{% load wagtailcore_tags %}

{% block content %}
<div class="container">
    <div class="row">
        <div class="col-md-8">
            <h1>{{ page.title }}</h1>

            {% if page.description %}
                <div class="course-description">
                    {{ page.description|richtext }}
                </div>
            {% endif %}

            {% if page.scorm_package %}
                <div class="scorm-course-info">
                    <h3>Course Content</h3>
                    <p><strong>Package:</strong> {{ page.scorm_package.title }}</p>
                    {% if page.scorm_package.description %}
                        <p>{{ page.scorm_package.description }}</p>
                    {% endif %}
                </div>

                {% if user.is_authenticated %}
                    {% if enrollment %}
                        <div class="enrollment-status">
                            <div class="alert alert-info">
                                <strong>Enrolled:</strong> {{ enrollment.enrolled_at|date:"M d, Y" }}
                                {% if progress %}
                                    <br><strong>Progress:</strong> {{ progress.completion_status|title }}
                                    {% if progress.score_raw %}
                                        <br><strong>Score:</strong> {{ progress.score_raw }}
                                        {% if progress.score_max %}/ {{ progress.score_max }}{% endif %}
                                    {% endif %}
                                {% endif %}
                            </div>
                            <a href="{% url 'wagtail_lms:scorm_player' page.id %}" class="btn btn-primary btn-lg">
                                {% if progress.completion_status == 'completed' %}
                                    Review Course
                                {% else %}
                                    {% if progress %}Continue Course{% else %}Start Course{% endif %}
                                {% endif %}
                            </a>
                        </div>
                    {% else %}
                        <div class="enrollment-actions">
                            <a href="{% url 'wagtail_lms:enroll_course' page.id %}" class="btn btn-success btn-lg">
                                Enroll in Course
                            </a>
                        </div>
                    {% endif %}
                {% else %}
                    <div class="alert alert-warning">
                        Please login to enroll in this course.
                    </div>
                {% endif %}
            {% else %}
                <div class="alert alert-warning">
                    This course doesn't have any content assigned yet.
                </div>
            {% endif %}
        </div>

        <div class="col-md-4">
            <div class="course-sidebar">
                <h4>Course Information</h4>
                {% if page.scorm_package %}
                    <ul class="list-unstyled">
                        <li><strong>Type:</strong> SCORM {{ page.scorm_package.version }}</li>
                        <li><strong>Added:</strong> {{ page.scorm_package.created_at|date:"M d, Y" }}</li>
                    </ul>
                {% endif %}
            </div>
        </div>
    </div>
</div>
{% endblock %}