{% extends 'base.html' %}
{% block title %}{{ title }} | Learning management system{% endblock title %}
{% load static %}

{% block content %}

<nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="/">Home</a></li>
        <li class="breadcrumb-item"><a href="{% url 'programs' %}">Programs</a></li>
        <li class="breadcrumb-item"><a href="{% url 'program_detail' course.program.id %}">{{ course.program }}</a></li>
        <li class="breadcrumb-item active" aria-current="page">{{ course }}</li>
    </ol>
</nav>

<div class="manage-wrap">
    <div class="d-flex">
        <div class="">
            {% if request.user.is_superuser %}
            <a class="btn btn-sm btn-light" href="{% url 'edit_course' course.slug %}">
                <i class="fas fa-pencil-alt"></i> Edit course
            </a>
            {% endif %}
            {% if request.user.is_superuser or request.user.is_teacher %}
            <a class="btn btn-sm btn-primary" href="{% url 'upload_file_view' course.slug %}"><i class="fas fa-plus"></i>
                Upload new file
            </a>
            <a class="btn btn-sm btn-primary" href="{% url 'upload_video' course.slug %}"><i class="fas fa-plus"></i>
                Upload new video
            </a>
            {% endif %}
        </div>
        <div class="ms-auto">
            <a class="btn btn-sm btn-warning" href="{% url 'quiz_index' course.slug %}"><i class="fas fa-list"></i>
                Take a Quiz
            </a>
        </div>
    </div>
</div>

<div class="title-1">{{ course }}</div>
<p class="small text-muted">{{ course.summary }}</p>

{% include 'snippets/messages.html' %}

<div class="container">

    <div class="row mb-5">
        <div class="col-md-12 p-0">
            <p class="form-title m-0">Video Tutorials</p>
            <div class="table-responsive">
                <table class="table table-shadow table-light table-striped m-0">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>Video Title</th>
                            <th>Uploaded Date</th>
                            <th>Get Started</th>
                            {% if request.user.is_superuser or request.user.is_teacher %}
                            <th>Actions</th>
                            {% endif %}
                        </tr>
                    </thead>
                    <tbody>
                        {% for video in videos %}
                        <tr>
                            <td>{{ forloop.counter }}</td>
                            <td>
                                <a href="{{ video.get_absolute_url }}" title="{{ video }}" class="d-flex align-items-center">
                                    <i class="fas fa-video me-1"></i> {{ video.title|title }}
                                </a>
                            </td>
                            <td>{{ video.timestamp|date }}</td>
                            <th>
                                <div>
                                    <a class="download-btn" href="{{ video.get_absolute_url }}"
                                        title="Download to your device">
                                        <i class="fas fa-play me-1"></i>Play now</a>
                                </div>
                            </th>

                            {% if request.user.is_superuser or request.user.is_teacher %}
                            <td>
                                <div class="update-delete">
                                    <a href="{% url 'upload_video_edit' slug=course.slug video_slug=video.slug %}"
                                        class="update" title="Edit">
                                        <i class="fas fa-pencil-alt"></i>
                                    </a>
                                    <a href="{% url 'upload_video_delete' slug=course.slug video_slug=video.slug %}"
                                        class="delete" title="Delete">
                                        <i class="fas fa-trash-alt"></i>
                                    </a>
                                </div>
                            </td>
                            {% endif %}
                        </tr>
                        {% empty %}
                        <tr>
                            <td></td>
                            <td></td>
                            <td>
                                <span class="text-danger">
                                    No video Uploaded.
                                    {% if request.user.is_superuser or request.user.is_teacher %}
                                    <a href="{% url 'upload_video' course.slug %}">
                                        <i class="primary" style="font-size: 22px;">
                                            Upload now.
                                        </i>
                                        {% endif %}
                                    </a>
                                </span>
                            </td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12 p-0">
            <p class="form-title m-0">Documentations</p>
            <div class="table-responsive">
                <table class="table table-shadow table-light table-striped m-0">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>File name</th>
                            <th>Uploaded Date</th>
                            <th>Updated Date</th>
                            <th>Downloads</th>
                            {% if request.user.is_superuser or request.user.is_teacher %}
                            <th>Actions</th>
                            {% endif %}
                        </tr>
                    </thead>
                    <tbody>
                        {% for file in files %}
                        <tr>
                            <td>{{ forloop.counter }}</td>
                            <td><a href="{{ file.file.url }}" title="{{ file }}" class="d-flex align-items-center">
                                    <i class="fas fa-file-{{ file.get_extension_short }} me-1"></i>
                                    {{ file.title|title }}
                                </a>
                            </td>
                            <td>{{ file.upload_time|date }}</td>
                            <td>{{ file.updated_date|date }}</td>
                            <th>
                                <div>
                                    <a class="download-btn" href="{{ file.file.url }}" title="Download to your device">
                                        <i class="fas fa-download me-1"></i>Download</a>
                                </div>
                            </th>

                            {% if request.user.is_superuser or request.user.is_teacher %}
                            <td>
                                <div class="update-delete">
                                    <a href="{% url 'upload_file_edit' slug=course.slug file_id=file.pk %}"
                                        class="update" title="Edit">
                                        <i class="fas fa-pencil-alt"></i>
                                    </a>
                                    <a href="{% url 'upload_file_delete' slug=course.slug file_id=file.pk %}"
                                        class="delete" title="Delete">
                                        <i class="fas fa-trash-alt"></i>
                                    </a>
                                </div>
                            </td>
                            {% endif %}
                        </tr>
                        {% empty %}
                        <tr>
                            <td></td>
                            <td></td>
                            <td>
                                <span class="text-danger">
                                    No File Uploaded.
                                    {% if request.user.is_superuser or request.user.is_teacher %}
                                    <a href="{% url 'upload_file_view' course.slug %}">
                                        <i class="primary" style="font-size: 22px;">
                                            Upload now.
                                        </i>
                                        {% endif %}
                                    </a>
                                </span>
                            </td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

</div>

<div class="site-section mb-5 mt-4">
    <div class="title-1">teacher(s)</div>
    <br>
    <br>
    <div class="container-fluid">
        <div class="row">
            {% for teacher in teachers %}
            <div class="col-lg-4">
                <div class="card text-center">
                    <div class="card-body">
                        {% if teacher.teacher.picture %}
                        <img class="avatar avatar-lg" src="{{ teacher.teacher.picture.url }}" alt="">
                        {% endif %}
                        <h5 class="fw-bold mb-0">{{ teacher|title }}</h5>
                        <p class="mb-0">{{ teacher.teacher.email }}</p>
                        <p class="text-muted small">Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod.</p>
                        <p>
                            <a class="btn btn-sm btn-secondary" href="#" role="button"><i
                                    class="fab fa-twitter"></i></a>
                            <a class="btn btn-sm btn-secondary" href="#" role="button"><i
                                    class="fab fa-facebook-f"></i></a>
                            <a class="btn btn-sm btn-secondary" href="#" role="button"><i
                                    class="fab fa-linkedin-in"></i></a>
                        </p>
                    </div>
                </div>
            </div>
            {% empty %}
            <h6 class="text-muted mt-3">No teacher assigned for this course</h6>
            {% endfor %}

        </div>
    </div>
</div>

{% endblock content %}