{% extends 'publisher/base.html' %}
{% load i18n %}
{% load static %}
{% block title %}
    {% trans "Course Detail" %}
{% endblock title %}

{% block page_content %}
{% include 'alert_messages.html' %}

<div id="stateChangeAlert" class="alert-messages hidden">
    <div class="alert alert-error" role="alert" tabindex="-1">
        <div>
            <p id="stateChangeError" class="alert-copy"></p>
        </div>
    </div>
</div>


<div class="layout-1t2t layout-flush publisher-container course-detail">
    <main class="layout-col layout-col-b layout-col-b-custom">
        <div class="course-information">

        <div class="edit-history-widget">
            {% with object.history.all as history_list %}
                {% if history_list.count > 1 %}
                    <div class="history-widget {% if not publisher_history_widget_feature %}hidden{% endif %}">
                        {% include 'publisher/_history_widget.html' %}
                    </div>
                {% endif %}
            {% endwith %}

            {% if can_edit %}
                {% url 'publisher:publisher_courses_edit' pk=object.id as edit_page_url %}
                <a id="btn_course_edit" href="{% if add_warning_popup %}#{% else %}{{ edit_page_url }}{% endif %}" class="btn btn-neutral btn-course-edit">
                    {% trans "EDIT" %}
                </a>
                <div class="clearfix"></div>
            {% endif %}
        </div>

            <div class="info-item">
                <div class="heading">
                    {% trans "Organization Name" %}
                </div>
                <div>
                    {{ object.organizations.first }}
                </div>
            </div>

            <div class="info-item">
                <div class="heading">
                    {% trans "Course Team Admin" %}
                </div>
                <div>{{ object.course_team_admin.full_name }}</div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Course Title" %}
                </div>
                <div class="current title">{{ object.course_title }}</div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Course Number" %}
                </div>
                <div class="current number">{{ object.number }}</div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Short Description" %}
                </div>
                <div class="current short_description">
                    {% with  object.course_short_description as field %}
                        {% include "publisher/_render_required_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Long Description" %}
                </div>
                <div class="current full_description">
                    {% with  object.course_full_description as field %}
                        {% include "publisher/_render_required_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "What You Will Learn" %}
                </div>
                <div class="current expected_learnings">
                    {% with  object.expected_learnings as field %}
                        {% include "publisher/_render_required_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Primary Subject" %}
                </div>
                <div class="current primary_subject">
                    {% with  object.primary_subject as field %}
                        {% include "publisher/_render_required_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Additional Subject" %}
                </div>
                <div class="current secondary_subject">
                    {% with  object.secondary_subject as field %}
                        {% include "publisher/_render_optional_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Additional Subject" %}
                </div>
                <div class="current tertiary_subject">
                    {% with  object.tertiary_subject as field %}
                        {% include "publisher/_render_optional_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>
            <div class="info-item">
                <div class="heading course-image-heading">
                    {% trans "Course Image" %}
                </div>
                {% if object.course_image_url %}
                    <img class="course-image" src="{{ object.course_image_url }}" alt="{% trans 'Course Image' %}">
                {% else %}
                    {% trans "(Required) Not yet added" %}
                {% endif %}
            </div>
            <div class="info-item history-field-container">
                <div class="heading">
                    {% trans "Prerequisites" %}
                </div>
                <div class="current prerequisites">
                    {% with  object.prerequisites as field %}
                        {% include "publisher/_render_optional_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>
            <div class="info-item history-field-container">
                <div class="heading">{% trans "Course Level" %}
                </div>
                <div class="current level_type">
                    {% with  object.level_type as field %}
                        {% include "publisher/_render_required_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>
            <div class="info-item history-field-container">
                <div class="heading">{% trans "Learner Testimonials" %}
                </div>
                <div class="current learner_testimonial">
                    {% with  object.learner_testimonial as field %}
                        {% include "publisher/_render_optional_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>
            <div class="info-item history-field-container">
                <div class="heading">{% trans "FAQ" %}
                </div>
                <div class="current faq">
                    {% with  object.faq as field %}
                        {% include "publisher/_render_optional_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">{% trans "Syllabus" %}
                </div>
                <div class="current faq">
                    {% with  object.syllabus as field %}
                        {% include "publisher/_render_optional_field.html" %}
                    {% endwith %}
                </div>
                <div class="show-diff"></div>
            </div>

            <div class="info-item history-field-container">
                <div class="heading">{% trans "About Video Link" %}
                </div>
                {% with  object.video_link as value %}
                    {% if value %}
                        <a class="current video_link" href="{{ value }}" target="_blank">{{ value }}</a>
                    {% else %}
                        {% trans "(Optional) Not yet added" %}
                    {% endif %}
                {% endwith %}
                <div class="show-diff"></div>
            </div>
        </div>
    </main>

    <aside id="right-panel" class="layout-col layout-col-a layout-col-a-custom">
        <div id="approval-widget" class="{% if publisher_hide_features_for_pilot %}hidden{% endif %}">
            {% include 'publisher/course_detail/_widgets.html' %}
        </div>
        <div id="comments-widget" class="comment-container {% if not publisher_comment_widget_feature %}hidden{% endif %}">
            {% include 'comments/add_auth_comments.html' %}
            {% include 'comments/comments_list.html' %}
        </div>
    </aside>
</div>
{% endblock %}
{% block extra_js %}
    <script src="{% static 'bower_components/google-diff-match-patch/diff_match_patch.js' %}"></script>
    <script src="{% static 'js/publisher/decode-html.js' %}"></script>
    <script src="{% static 'js/publisher/views/course_detail.js' %}"></script>
    <script src="{% static 'js/publisher/organizations.js' %}"></script>
    <script src="{% static 'js/publisher/comparing-objects.js' %}"></script>
    <script src="{% static 'js/publisher/jquery-dateFormat.min.js' %}"></script>
    <script src="{% static 'js/publisher/comments.js' %}"></script>
    <script src="{% static 'js/publisher/change-state.js' %}"></script>
    <script src="{% static 'js/publisher/revision-history.js' %}"></script>
    <script src="{% static 'js/publisher/modal-screen.js' %}"></script>
{% endblock %}
