{% extends 'publisher/base.html' %}

{% load compress %}
{% load i18n %}
{% load static %}

{% block title %}
    {% trans "Edit Course" %}
{% endblock title %}

{% block css %}
  {% compress css %}
      <link rel="stylesheet" href="{% static 'bower_components/tinymce/skins/lightgray/content.min.css' %}" type="text/x-scss">
      <link rel="stylesheet" href="{% static 'bower_components/tinymce/skins/lightgray/skin.min.css' %}" type="text/x-scss">
  {% endcompress %}
    {{ block.super }}
{% endblock %}

{% block page_content %}
    <div>
        <h1 class="hd-1 emphasized">{% trans "Edit Course" %}</h1>

        <div class="alert-messages">
            {% if messages %}
                {% for message in messages %}
                <div class="alert alert-{{ message.tags }}" role="alert" aria-labelledby="alert-title-{{ message.tags }}" tabindex="-1">
                    <div><p class="alert-copy">{{ message }}</p></div>
                </div>
                {% endfor %}
            {% endif %}
            <p>
                {% trans "All required fields must be complete before this course can be sent to edX marketing for review." %}
            </p>
            <p>
                <strong>{% trans "Note:" %}</strong>
                {% trans "If you edit course information after edX marketing has reviewed the course, you have to send the course for review again." %}
            </p>
            <form id="frm_course_edit" class="form" method="post" action="" enctype="multipart/form-data">{% csrf_token %}
                <input id="id_history_revision" type="hidden" value="{{ history_object.id }}">
                <div class="layout-full layout">
                    <div class="course-form">
                        <div class="course-information">
                            <fieldset class="form-group grid-container grid-manual">

                                <div class="field-title">{% trans "COURSE TITLE" %} <span class="required float-right">* Required for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <div id="id_title_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_title_comparison" class="show-comparison-data"></div>
                                        </div>
                                        <div class="row">
                                            <ul class="tabs">
                                                <li class="course-tabs active" data-tab="tab-practices">
                                                    {% trans "Best Practices" %}
                                                </li>
                                                <li class="course-tabs" data-tab="tab-example">
                                                    {% trans "Examples" %}
                                                </li>
                                            </ul>
                                        </div>
                                        <div id="tab-practices" class="content active">
                                            <p>{% trans "Maximum 70 characters. Recommended 50 or fewer characters." %}</p>

                                            <p>{% trans "An effective course title:" %}</p>
                                            <ul>
                                                <li>{% trans "Clearly indicates the course subject matter." %}</li>
                                                <li>{% trans "Follows search engine optimization (SEO) guidelines." %}</li>
                                                <li>{% trans "Targets a global audience." %}</li>
                                            </ul>
                                            <p>{% trans "If the course is part of a sequence, include both sequence and course information as \"Sequence: Course\"." %}</p>
                                        </div>
                                        <div id="tab-example" class="content">
                                            <p></p>
                                            <strong>{% trans "Single Courses" %}</strong>
                                            <ul>
                                                <li>{% trans "English Grammar and Essay Writing" %}</li>
                                            </ul>
                                            <strong>{% trans "Sequence Courses:" %}</strong>
                                            <ul>
                                                <li>{% trans "Statistics: Inference" %}</li>
                                                <li>{% trans "Statistics: Probability" %}</li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="col col-6">
                                        {% if form.organization.field.queryset.all.count > 1 %}
                                            <label class="field-label">{{ form.organization.label_tag }} <span class="required">*</span></label>
                                            {{ form.organization }}
                                        {% else %}
                                            {% with form.organization.field.queryset|first as organization %}
                                                <label id="organization-name" class="field-label"
                                                       data-org_id="{{ organization.id }}">{{ form.organization.label_tag }} <span class="required">*</span>
                                                </label>
                                                <span class="read-only-field">{{ organization.name }}</span>
                                                <input id="id_organization" name="organization" type="hidden"
                                                       value="{{ organization.id }}">
                                            {% endwith %}
                                        {% endif %}

                                        <label class="field-label">
                                            {{ form.team_admin.label_tag }} <span class="required">*</span>
                                        </label> {{ form.team_admin }}


                                        <label class="field-label ">{{ form.title.label }} <span class="required">*</span></label>
                                        <input id="id_title_revision" type="hidden" value="{{ history_object.title }}" class="history">
                                        {{ form.title }}
                                        <p>{% trans "255 character limit, including spaces." %}</p>
                                        {% if form.title.errors %}
                                            <div class="field-message has-error">
                                                <span class="field-message-content">
                                                    {{ form.title.errors|escape }}
                                                </span>
                                            </div>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="field-title">{% trans "COURSE NUMBER" %} <span class="required float-right">* Required for announcement</span></div>
                                <div class="row">
                                    <div class="col col-6 help-text">
                                        <div class="row">
                                            <ul class="tabs">
                                                <li class="course-tabs active" data-tab="tab-practices">
                                                    {% trans "Best Practices" %}
                                                </li>
                                                <li class="course-tabs" data-tab="tab-example">
                                                    {% trans "Examples" %}
                                                </li>
                                            </ul>
                                        </div>
                                        <div id="tab-practices" class="content active">
                                            <ul>
                                                <li>{% trans "Maximum 10 characters. Characters can be letters, numbers, or periods." %}</li>
                                                <li>{% trans "If a course consists of several modules, the course number can have an ending such as .1x or .2x." %}</li>
                                            </ul>
                                        </div>
                                        <div id="tab-example" class="content">
                                            <ul>
                                                <li>{% trans "CS002x" %}</li>
                                                <li>{% trans "BIO1.1x, BIO1.2x" %}</li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.number.label_tag }} <span class="required">*</span></label>
                                        {{ form.number }}
                                    </div>
                                </div>
                            </fieldset>
                        </div>

                        <div class="{% if publisher_hide_features_for_pilot %}hidden{% endif %}">
                        <div class="course-information">
                            <fieldset class="form-group grid-container grid-manual">
                                <div class="field-title">{% trans "SHORT DESCRIPTION" %} <span class="required float-right">* Required for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <div id="id_short_description_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_short_description_comparison" class="show-comparison-data"></div>
                                        </div>
                                        <div class="row">
                                        <ul class="tabs">
                                            <li class="course-tabs active" data-tab="tab-practices">
                                                {% trans "Best Practices" %}
                                            </li>
                                            <li class="course-tabs" data-tab="tab-example">
                                                {% trans "Examples" %}
                                            </li>
                                        </ul>
                                    </div>
                                    <div id="tab-practices" class="content active">
                                        <p>{% trans "An effective short description:" %}</p>
                                        <ul>
                                            <li>{% trans "Contains 25–50 words." %}</li>
                                            <li>{% trans "Functions as a tagline." %}</li>
                                            <li>{% trans "Conveys compelling reasons to take the course." %}</li>
                                            <li>{% trans "Follows SEO guidelines." %}</li>
                                            <li>{% trans "Targets a global audience." %}</li>
                                        </ul>
                                    </div>
                                    <div id="tab-example" class="content">
                                        <p>{% trans "The first MOOC to teach positive psychology. Learn science-based principles and practices for a happy, meaningful life." %}</p>
                                    </div>
                                    </div>
                                    <div class="col col-6">
                                        <input id="id_short_description_revision" type="hidden" value="{{ history_object.short_description }}" class="history">
                                        <label class="field-label ">{{ form.short_description.label_tag }} <span class="required">*</span></label>
                                        {{ form.short_description }}
                                        <p>{% trans "255 character limit, including spaces." %}</p>
                                            {% if form.short_description.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.short_description.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                    </div>
                                </div>

                                <div class="field-title">{% trans "LONG DESCRIPTION" %} <span class="required float-right">* Required for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <div id="id_full_description_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_full_description_comparison" class="show-comparison-data"></div>
                                        </div>
                            <div class="row">
                                <ul class="tabs">
                                    <li class="course-tabs active" data-tab="tab-practices">
                                        {% trans "Best Practices" %}
                                    </li>
                                    <li class="course-tabs" data-tab="tab-example">
                                        {% trans "Examples" %}
                                    </li>
                                </ul>
                            </div>
                            <div id="tab-practices" class="content active">
                                <p>{% trans "An effective long description:" %}</p>
                                <ul>
                                    <li>{% trans "Contains 150–300 words." %}</li>
                                    <li>{% trans "Is easy to skim." %}</li>
                                    <li>{% trans "Uses bullet points instead of dense text paragraphs." %}</li>
                                    <li>{% trans "Follows SEO guidelines." %}</li>
                                    <li>{% trans "Targets a global audience." %}</li>
                                </ul>
                                <p>{% trans "The first four lines are visible when the About page opens. Learners can select \"See More\" to view the full description." %}</p>
                            </div>
                            <div id="tab-example" class="content">
                                <strong>{% trans "Content-based example:" %}</strong>
                                <p>{% trans "Want to learn computer programming, but unsure where to begin? This is the course for you! Scratch is the computer programming language that makes it easy and fun to create interactive stories, games and animations and share them online." %}</p>
                                <p>{% trans "This course is an introduction to computer science using the programming language Scratch, developed by MIT. Starting with the basics of using Scratch, the course will stretch your mind and challenge you. You will learn how to create amazing games, animated images and songs in just minutes with a simple “drag and drop” interface." %}</p>
                                <p>{% trans "No previous programming knowledge needed. Join us as you start your computer science journey." %}</p>
                                <strong>{% trans "Skills-based example:" %}</strong>
                                <span>{% trans "Taught by instructors with decades of experience on Wall Street, this M&A course will equip analysts and associates with the skills they need to rise to employment in the M&A field. Additionally, directors and managers who have transitioned, or hope to transition, to M&A from other areas such as equities or fixed income can use this course to eliminate skill gaps." %}</span>
                            </div>
                        </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.full_description.label_tag }} <span class="required">*</span></label>
                                        <input id="id_full_description_revision" type="hidden" value="{{ history_object.full_description }}" class="history">
                                        {{ form.full_description }}
                                        <p>{% trans "2500 character limit, including spaces." %}</p>
                                            {% if form.full_description.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.full_description.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                    </div>
                                </div>


                                <div class="field-title">{% trans "WHAT YOU WILL LEARN" %} <span class="required float-right">* Required for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <div id="id_expected_learnings_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_expected_learnings_comparison" class="show-comparison-data"></div>
                                        </div>
                                        <div class="row">
                                            <ul class="tabs">
                                                <li class="course-tabs active" data-tab="tab-practices">
                                                    {% trans "Best Practices" %}
                                                </li>
                                                <li class="course-tabs" data-tab="tab-example">
                                                    {% trans "Examples" %}
                                                </li>
                                            </ul>
                                        </div>
                                        <div id="tab-practices" class="content active">
                                            <ul>
                                                <li>{% trans "The skills and knowledge learners will acquire in this course." %}</li>
                                                <li>{% trans "Format each item as a bullet with four to ten words." %}</li>
                                            </ul>
                                        </div>
                                        <div id="tab-example" class="content">
                                            <ul>
                                                <li>{% trans "Basic R Programming" %}</li>
                                                <li>{% trans "An applied understanding of linear and logistic regression" %}</li>
                                                <li>{% trans "Application of text analytics" %}</li>
                                                <li>{% trans "Linear and integer optimization" %}</li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.expected_learnings.label_tag }} <span class="required">*</span></label>
                                        <input id="id_expected_learnings_revision" type="hidden" value="{{ history_object.expected_learnings }}" class="history">
                                        {{ form.expected_learnings }}
                                        <p>{% trans "2500 character limit, including spaces." %}</p>
                                            {% if form.expected_learnings.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.expected_learnings.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                    </div>
                                </div>

                                <div class="field-title">{% trans "SUBJECT FIELD" %} <span class="required float-right">* Required for announcement</span></div>
                                <div class="row">
                                    <div class="col col-6 help-text">
                                        <p>{% trans "The subject of the course." %}</p>
                                        <p>{% trans "You can select up to two subjects in addition to the primary subject. Only the primary subject appears on the About page." %}</p>
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.primary_subject.label_tag }} <span class="required">*</span></label>
                                        {{ form.primary_subject }}
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col col-6 help-text">&nbsp;
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.secondary_subject.label_tag }}</label>
                                        {{ form.secondary_subject }}
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col col-6 help-text">&nbsp;
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.tertiary_subject.label_tag }}</label>
                                        {{ form.tertiary_subject }}
                                    </div>
                                </div>

                                <div class="field-title">{% trans "COURSE IMAGE" %} <span class="required float-right">* Required for announcement</span></div>
                                <div class="row">
                                    <div class="col col-6 help-text">
                                        {% trans "An eye-catching, colorful image that captures the essence of your course." %}
                                        <br/>
                                        <strong>{% trans "Course Image Guidelines:" %}</strong>
                                        <ul>
                                            <li>{% trans "The image size must be 2120 x 1192 pixels." %}</li>
                                            <li>{% trans "Each course in a sequence must have a unique image." %}</li>
                                            <li>{% trans "The image cannot include text or headlines." %}</li>
                                            <li>{% trans "You must have permission to use the image. Possible image sources include Flickr creative commons, Stock Vault, Stock XCHNG, and iStock Photo." %}</li>
                                        </ul>
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.image.label_tag }} <span class="required">*</span></label>
                                        <div class="course-image-field">
                                            {{ form.image }}
                                            <div class="image-error has-error hidden"></div>
                                            {% if form.image.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.image.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                        </div>
                                    </div>
                                </div>

                                <div class="field-title">{% trans "PREREQUISITES" %} <span class="optional float-right">Optional for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <div id="id_prerequisites_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_prerequisites_comparison" class="show-comparison-data"></div>
                                        </div>
                                        <div class="row">
                                            <ul class="tabs">
                                                <li class="course-tabs active" data-tab="tab-practices">
                                                    {% trans "Best Practices" %}
                                                </li>
                                                <li class="course-tabs" data-tab="tab-example">
                                                    {% trans "Examples" %}
                                                </li>
                                            </ul>
                                        </div>
                                        <div id="tab-practices" class="content active">
                                            <ul>
                                                <li>{% trans "Maximum 200 characters." %}</li>
                                                <li>{% trans "Specific knowledge learners must have to be successful in the course. If the course has no prerequisites, enter \"None\"." %}</li>
                                            </ul>

                                        </div>
                                        <div id="tab-example" class="content">
                                            <ul>
                                                <li>{% trans "Secondary school (high school) algebra; basic mathematics concepts" %}</li>
                                                <li>{% trans "Graduate-level understanding of Keynesian economics" %}</li>
                                                <li>{% trans "Basic algebra" %}</li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.prerequisites.label_tag }}</label>
                                        <input id="id_prerequisites_revision" type="hidden" value="{{ history_object.prerequisites }}" class="history">
                                        {{ form.prerequisites }}
                                        <p>{% trans "200 character limit, including spaces." %}</p>
                                            {% if form.prerequisites.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.prerequisites.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                    </div>
                                </div>

                                <div class="field-title">{% trans "SYLLABUS" %} <span class="optional float-right">Optional for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <div id="id_syllabus_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_syllabus_comparison" class="show-comparison-data"></div>
                                        </div>
                                        <div class="row">
                                            <ul class="tabs">
                                                <li class="course-tabs active" data-tab="tab-practices">
                                                    {% trans "Best Practices" %}
                                                </li>
                                                <li class="course-tabs" data-tab="tab-example">
                                                    {% trans "Examples" %}
                                                </li>
                                            </ul>
                                        </div>
                                        <div id="tab-practices" class="content active">
                                            <ul>
                                                <li>{% trans "A review of content covered in your course, organized by week or module." %}</li>
                                                <li>{% trans "Focus on topics and content." %}</li>
                                                <li>{% trans "Do not include detailed information about course logistics, such as grading, communication policies, and reading lists." %}</li>
                                                <li>{% trans "Format items as either paragraphs or a bulleted list." %}</li>
                                            </ul>
                                        </div>
                                        <div id="tab-example" class="content">
                                            <ul>
                                                <li>{% trans "Week 1: From Calculator to Computer" %} <br/>
                                                    {%trans "Introduction to basic programming concepts, such as values and expressions, as well as making decisions when implementing algorithms and developing programs." %}
                                                </li>
                                                <li>{% trans "Week 2: State Transformation" %} <br/>
                                                    {%trans "Introduction to state transformation, including representation of data and programs as well as conditional repetition." %}
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="col col-6">
                                        <label class="field-label ">{{ form.syllabus.label_tag }}</label>
                                        <input id="id_syllabus_revision" type="hidden" value="{{ history_object.syllabus }}" class="history">
                                        {{ form.syllabus }}
                                        <p>{% trans "2500 character limit, including spaces." %}</p>
                                            {% if form.syllabus.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.syllabus.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                    </div>
                                </div>

                                <div class="field-title">{% trans "LEVEL" %}  <span class="required float-right">* Required for announcement</span></div>
                                <div class="row">
                                    <div class="col col-6 help-text">
                                        <ul>
                                            <li>{% trans "Introductory - No prerequisites; a learner who has completed some or all secondary school could complete the course." %}</li>
                                            <li>{% trans "Intermediate - Basic prerequisites; learners need to complete secondary school or some university courses." %}</li>
                                            <li>{% trans "Advanced - Significant prerequisites; the course is geared to third or fourth year university students or master's degree students." %}</li>
                                        </ul>
                                    </div>
                                    <div class="col col-6 help-text">
                                        <label class="field-label ">{{ form.level_type.label_tag }} <span class="required">*</span></label>
                                        {{ form.level_type }}
                                    </div>
                                </div>

                                <div class="field-title">{{ form.faq.label }} <span class="optional float-right">Optional for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <p>{% trans "Any frequently asked questions and the answers to those questions." %}</p>
                                    </div>
                                        <div id="id_faq_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_faq_comparison" class="show-comparison-data"></div>
                                        </div>
                                    <div class="col col-6 help-text">
                                        <label class="field-label ">{{ form.faq.label }}</label>
                                        <input id="id_faq_revision" type="hidden" value="{{ history_object.faq }}" class="history">
                                        {{ form.faq }}
                                        <p>{% trans "2500 character limit, including spaces." %}</p>
                                            {% if form.faq.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.faq.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                    </div>
                                </div>
                                {% if is_internal_user %}
                                    <div class="field-title">{{ form.video_link.label|upper }} <span class="optional float-right">Optional for announcement</span></div>
                                    <div class="row">
                                        <div class="col col-6 help-text">
                                            <div class="row">
                                                <ul class="tabs">
                                                    <li class="course-tabs active" data-tab="tab-practices">
                                                        {% trans "Best Practices" %}
                                                    </li>
                                                    <li class="course-tabs" data-tab="tab-example">
                                                        {% trans "Examples" %}
                                                    </li>
                                                </ul>
                                            </div>
                                            <div id="tab-practices" class="content active">
                                                <p>
                                                    {%trans "The About video should excite and entice potential students to take your course. Think of it as a movie trailer or TV show promotion. The video should be compelling, and exhibit the instructor’s personality." %}<br>
                                                    {%trans "The ideal length is 30-90 seconds (learners typically watch an average of 30 seconds)." %}<br>
                                                    {%trans "The About video should be produced and edited, using elements such as graphics and stock footage." %}
                                                </p>
                                                <p>{% trans "The About video should answer these key questions." %}</p>
                                                <ul>
                                                    <li>{% trans "Why should a learner register?" %}</li>
                                                    <li>{% trans "What topics and concepts are covered?" %}</li>
                                                    <li>{% trans "Who is teaching the course?" %}</li>
                                                    <li>{% trans "What institution is delivering the course?" %}</li>
                                                </ul>
                                                <p>{% trans "Naming specifications:" %}</p>
                                                <ul>
                                                    <li>{% trans "Name: InstitutionX_CourseNumber_About.mov" %}</li>
                                                    <li>{% trans "Post to:" %} <a href="http://veda.edx.org/upload" target="_blank">http://veda.edx.org/upload</a></li>
                                                </ul>
                                                <p>{% trans "Technical specifications:" %}</p>
                                                <ul>
                                                    <li>{% trans "Codec: H.264" %}</li>
                                                    <li>{% trans "Container: .mp4" %}</li>
                                                    <li>{% trans "Resolution: 1920x1080" %}</li>
                                                    <li>{% trans "Frame rate: 29.97 fps" %}</li>
                                                    <li>{% trans "Aspect: 1.0" %}</li>
                                                    <li>{% trans "Bitrate: 5Mbps VBR" %}</li>
                                                    <li>{% trans "Audio codec: AAC 44.1KHz/192 Kbps" %}</li>
                                                </ul>
                                            </div>
                                            <div id="tab-example" class="content">
                                                <p>
                                                    {%trans "Visit edX’s YouTube channel for examples of other About videos:" %}
                                                    <a href="www.youtube.com/user/EdXOnline" target="_blank">www.youtube.com/user/EdXOnline</a>
                                                </p>
                                            </div>
                                        </div>
                                        <div class="col col-6 help-text">
                                            <label class="field-label ">{{ form.video_link.label }} <span class="optional"></span></label>
                                            {{ form.video_link }}
                                        </div>
                                    </div>
                                {% else %}
                                    {{ form.video_link }}
                                {% endif %}

                                <div class="field-title">{{ form.learner_testimonial.label|upper }} <span class="optional float-right">Optional for announcement</span></div>
                                <div class="row show-comparison-container">
                                    <div class="col col-6 help-text">
                                        <div id="id_learner_testimonial_parent" class="comparison-container">
                                            <a id="close-comparison" class="close " href="#!">x</a>
                                            <div id="id_learner_testimonial_comparison" class="show-comparison-data"></div>
                                        </div>
                                        <div class="row">
                                            <ul class="tabs">
                                                <li class="course-tabs active" data-tab="tab-practices">
                                                    {% trans "Best Practices" %}
                                                </li>
                                                <li class="course-tabs" data-tab="tab-example">
                                                    {% trans "Examples" %}
                                                </li>
                                            </ul>
                                        </div>
                                        <div id="tab-practices" class="content active">
                                            <ul>
                                                <li>{% trans "A quote from a learner in the course, demonstrating the value of taking the course." %}</li>
                                                <li>{% trans "Should be no more than 25-50 words in length." %}</li>
                                            </ul>
                                        </div>
                                        <div id="tab-example" class="content">
                                            <p>
                                                {%trans "“Brilliant course! It's definitely the best introduction to electronics in the world! Interesting material, clean explanations, well prepared quizzes, challenging homeworks and fun labs.” – Previous Student" %}
                                            </p>
                                        </div>
                                    </div>
                                    <div class="col col-6 help-text">

                                        <label class="field-label ">{{ form.learner_testimonial.label }}</label>
                                         <input id="id_learner_testimonial_revision" type="hidden" value="{{ history_object.learner_testimonial }}" class="history">
                                        {{ form.learner_testimonial }}
                                        <p>{% trans "500 character limit, including spaces." %}</p>
                                            {% if form.learner_testimonial.errors %}
                                                <div class="field-message has-error">
                                                    <span class="field-message-content">
                                                        {{ form.learner_testimonial.errors|escape }}
                                                    </span>
                                                </div>
                                            {% endif %}
                                    </div>
                                </div>
                            </fieldset>
                        </div>
                    </div>
                    </div>
                </div>

                <div class="layout-full layout-no-bkg">
                    <div class="course-edit-actions">
                        <a class="btn-cancel" href="{% url 'publisher:publisher_course_detail' course.id %}">
                            {% trans "Cancel" %}
                        </a>
                        <button class="btn-brand btn-base btn-save" type="submit">{% trans "Update Course" %}</button>
                    </div>
                </div>

            </form>
        </div>
    </div>
{% endblock %}

{{% block extra_js %}

    <script src="{% static 'js/publisher/course-tabs.js' %}"></script>
    <script src="{% static 'js/publisher/organizations.js' %}"></script>
    <script src="{% static 'js/publisher/image-validation.js' %}"></script>
    <script src="{% static 'js/publisher/course-image.js' %}"></script>
    <script src="{% static 'bower_components/tinymce/tinymce.min.js' %}"></script>
    <script src="{% static 'js/publisher/tinymce-init.js' %}"></script>
    <script src="{% static 'js/publisher/tinymce-charactercount.plugin.js' %}"></script>

    <script src="{% static 'bower_components/tinymce/themes/modern/theme.min.js' %}"></script>
    <script src="{% static 'bower_components/tinymce/plugins/lists/plugin.min.js' %}"></script>
    <script src="{% static 'bower_components/tinymce/plugins/link/plugin.min.js' %}"></script>
    <script src="{% static 'bower_components/tinymce/plugins/anchor/plugin.min.js' %}"></script>
    <script src="{% static 'bower_components/tinymce/plugins/paste/plugin.min.js' %}"></script>

    <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/modal-screen.js' %}"></script>
    <script src="{% static 'js/publisher/disable-track-change-btns.js' %}"></script>

{% endblock %}


