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

{% load i18n %}
{% load staticfiles %}

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

{% block page_content %}
<div>
<h1 class="hd-1 emphasized">New 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 %}

<form class="form" method="post" action="" enctype="multipart/form-data">
{% csrf_token %}
<div class="layout-full publisher-layout layout">
    <h2 class="layout-title">{% trans "Studio instance information" %}</h2>

    <div class="card course-form">
        <p>
            {% trans "The information in this section is required to create a course studio instance. You must fill all required information but are welcome to come back and enter the rest of the information when you are ready to announce the course, or you can do it all at once if you are ready to do so." %}
        </p>
        <div class="course-information">
            <fieldset class="form-group grid-container grid-manual">

                <div class="field-title">{% trans "CONTACTED PARTNER MANAGER" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "Contacted a PM about the creation of a new course is important so that edx can help you on marketing efforts." %}
                    </div>
                    <div class="col col-6">
                        <label class="field-label">
                            {{ run_form.contacted_partner_manager.label_tag }}
                            <span class="required">* {% trans "required" %}</span>
                        </label>

                        <div class="checkbox-inline">{{ run_form.contacted_partner_manager}}</div>
                    </div>
                </div>

                <div class="field-title">{% trans "COURSE TITLE" %}</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 "Example" %}
                                </li>
                            </ul>
                        </div>
                        <div id="tab-practices" class="content active">
                            <p>{% trans "Concise 70 characters maximum; < 50 chars. recommended." %}</p>
                            <p>{% trans "Descriptive - clearly indicates what the course is about." %}</p>
                            <p>{% trans "SEO-optimized and targeted to a global audience." %}</p>
                            <p>{% trans 'If the course falls in a sequence, our titling convention is: "Course Title: Subtitle"' %}</p>
                        </div>
                        <div id="tab-example" class="content">
                            <p>“{% trans "English Grammar and Essay Writing" %}”</p>
                            <p>{% trans "Sequence Courses:" %}</p>
                            <p>“{% trans "Introduction to Statistics" %}”</p>
                            <p>“{% trans "Statistics: Inference" %}”</p>
                            <p>“{% trans "Statistics: Probability" %}”</p>
                        </div>
                    </div>
                    <div class="col col-6">
                        {% if course_form.organization.field.queryset.all.count > 1 %}
                          <label class="field-label">{{ course_form.organization.label_tag }} <span
                              class="required">* {% trans "required" %}</span> </label>
                          {{ course_form.organization }}
                        {% else %}
                          {% with course_form.organization.field.queryset|first as organization %}
                            <label id="organization-name" class="field-label"
                                   data-org_id="{{ organization.id }}">{{ course_form.organization.label_tag }} {{ organization.name }}
                            </label>
                            <input id="id_organization" name="organization" type="hidden" value="{{ organization.id }}">
                          {% endwith %}
                        {% endif %}

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


                        <label class="field-label ">{{ course_form.title.label }}
                            <span class="required">* {% trans "required" %}</span>
                        </label>
                        {{ course_form.title }}
                    </div>
                </div>

                <div class="field-title">{% trans "COURSE START DATE" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "Start on a weekday (preferably Tuesday, Wednesday, or Thursday) and avoid major U.S. holidays for best access to edX staff." %}
                        {% trans "Approximate dates are acceptable; If you are unable to give an exact date, please identify a month in which the course will be offered." %}
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ run_form.start.label_tag }}
                            <span class="required">* {% trans "required" %}</span>
                        </label>
                        {{ run_form.start }}
                    </div>
                </div>


                <div class="field-title">{% trans "COURSE END DATE" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "The date when this self-paced course run will end, replaced by an updated version of the course" %}
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">
                            {{ run_form.end.label_tag }}
                            <span class="required">* {% trans "required" %}</span>
                        </label>
                        {{ run_form.end }}
                    </div>
                </div>

                <div class="field-title">{% trans "PACING TYPE" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "Will your course be open to students at the same time as it is announced?" %}
                    </div>
                    <div class="col col-6">
                        <label class="field-label">
                            {{ run_form.pacing_type.label_tag }}
                            <span class="required">* {% trans "required" %}</span>
                        </label>
                        <div class="checkbox-inline">{{ run_form.pacing_type }}</div>
                    </div>
                </div>

                <div class="field-title">{% trans "COURSE NUMBER" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <p>{% trans 'Courses split into several modules can be denoted by adding .1, .2, etc. at the end of the course number before the “x”' %}</p>
                        <p>{% trans 'No special html characters, accents, spaces, dashes, or underscores' %}</p>
                        <p>{% trans '10 character limit' %}</p>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.number.label_tag }}
                            <span class="required">* {% trans "required" %}</span>
                        </label>
                        {{ course_form.number }}
                    </div>
                </div>

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


<div class="layout-full publisher-layout layout">
    <h2 class="layout-title">{% trans "About page information" %}</h2>
    <div class="card course-form">
        <div class="course-information">
            <fieldset class="form-group grid-container grid-manual">

                <div class="field-title">{% trans "Seat Type" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "The date when this self-paced course run will end, replaced by an updated version of the course" %}
                    </div>
                    <div class="col col-6">
                        <div class="row">
                            <div class="col col-6">
                                <label class="field-label ">{{ seat_form.type.label_tag }}
                                    <span class="required">* {% trans "required" %}</span>
                                </label>
                                {{ seat_form.type}}
                            </div>
                            <div class="col col-6">
                                <label class="field-label ">{{ seat_form.price.label_tag }}</label>
                                {{ seat_form.price}}
                            </div>
                        </div>
                        {% if seat_form.price.errors %}
                        <div class="field-message has-error">
                                        <span class="field-message-content">
                                            {{ seat_form.price.errors|escape }}
                                        </span>
                        </div>
                        {% endif %}
                    </div>

                </div>


                <div class="field-title">{% trans "Brief Description" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <ul>
                            <li>{% trans "Reads as a tag line - a short, engaging description for students browsing course listings" %}
                            </li>
                            <li>{% trans "Conveys why someone should take the course" %}</li>
                            <li>{% trans "SEO optimized and targeted to a global audience" %}</li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.short_description.label_tag }}</label>
                        {{ course_form.short_description }}
                    </div>
                </div>

                <div class="field-title">{% trans "FULL DESCRIPTION" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "Summarized description of course content" %}
                        <ul>
                            <li>{% trans "Describe why a learner should take this course" %}</li>
                            <li>{% trans "SEO optimized and targeted to a global audience" %}</li>
                            <li>{% trans "Text should be easily scannable, using bullet points to highlight instead of long, dense text paragraphs" %}
                            </li>
                            <li>
                                {% trans "Note: the first 4-5 lines will be visible to the learner immediately upon clicking the page;" %}
                                {% trans 'additional text will be hidden yet available via "See More" clickable text under the first 4-5 lines' %}
                            </li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.full_description.label_tag }}</label>
                        {{ course_form.full_description }}
                    </div>
                </div>


                <div class="field-title">{% trans "EXPECTED LEARNINGS" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <ul>
                            <li>{% trans 'Answer to the question: "What will you learn from this course?"' %}</li>
                            <li>{% trans "bulleted items, approximately 4-10 words per bullet" %}</li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.expected_learnings.label_tag }}</label>
                        {{ course_form.expected_learnings }}
                    </div>
                </div>

                <div class="field-title">{% trans "COURSE STAFF" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <ul>
                            <li>{% trans "If there is more than one instructor, please indicate the order in which the instructors should be listed" %}
                            </li>
                            <li>{% trans "Limited to the primary instructors a learner will encounter in videos" %}</li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        {{ run_form.staff }}
                    </div>
                </div>

                <div class="field-title">{% trans "KEYWORDS" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "Some instructions here???" %}
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.keywords.label_tag }}</label>
                        {{ course_form.keywords}}

                        <label class="field-label ">{{ course_form.is_seo_review.label_tag }}</label>
                        {{ course_form.is_seo_review}}
                    </div>
                </div>

                <div class="field-title">{% trans "SUBJECT FIELD" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "Only one primary subject will appear on the About Page; please select one primary subject and a maximum of two additional subject areas for search." %}
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.primary_subject.label_tag }}</label>
                        {{ course_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 ">{{ course_form.secondary_subject.label_tag }}</label>
                        {{ course_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 ">{{ course_form.tertiary_subject.label_tag }}</label>
                        {{ course_form.tertiary_subject }}
                    </div>
                </div>

                <div class="field-title">{% trans "COURSE IMAGE" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        {% trans "Select an eye-catching, colorful image that captures the content and essence of your course" %}
                        <ul>
                            <li>{% trans "Do not include text or headlines" %}</li>
                            <li>{% trans "Choose an image that you have permission to use." %}
                                {% trans "This can be a stock photo (try Flickr creative commons, " %}
                                {% trans "Stock Vault, Stock XCHNG, iStock Photo) or an image custom designed for your course" %}
                            </li>
                            <li>{% trans "Sequenced courses should each have a unique image" %}</li>
                            <li>{% trans "Size: 2120 x 1192 pixels" %}</li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.image.label_tag }}</label>
                        {{ course_form.image }}
                    </div>
                </div>

                <div class="field-title">{% trans "PREREQUISITES" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <ul>
                            <li>{% trans "List concepts and level (basic, advanced, undergraduate, graduate) students should be familiar with" %}
                            </li>
                            <li>{% trans 'If there are no prerequisites, please list "None."' %}</li>
                            <li>{% trans "200 character limit, including spaces" %}</li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ course_form.prerequisites.label_tag }}</label>
                        {{ course_form.prerequisites }}
                    </div>
                </div>

                <div class="field-title">{% trans "ESTIMATED EFFORT" %}</div>
                <div class="row">
                    <div class="col col-6">
                        <ul>
                            <li>{% trans "Number of hours per week the learner should expect to spend on the course to be successful" %}
                            </li>
                            <li>{% trans "Should be realistic, and can be a range" %}</li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <div class="row">
                            <div class="col col-6">
                                <label class="field-label ">{% trans "Min Effort" %}</label>
                                {{ run_form.min_effort }}
                            </div>
                            <div class="col col-6">
                                <label class="field-label ">{% trans "Max Effort" %}</label>
                                {{ run_form.min_effort }}
                            </div>
                        </div>
                    </div>


                </div>

                <div class="field-title">{% trans "LANGUAGE(S)" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <ul>
                            <li>
                                {% trans "Course content (navigation and course content excluding videos)" %}
                            </li>
                            <li>
                                {% trans "Videos (language spoken in course videos)" %}
                            </li>
                            <li>
                                {% trans "Video transcript (video caption language)" %}
                            </li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ run_form.language.label_tag }}</label>
                        {{ run_form.language}}

                        <label class="field-label ">{{ run_form.transcript_languages.label_tag }}</label>
                        {{ run_form.transcript_languages}}

                        <label class="field-label ">{{ run_form.video_language.label_tag }}</label>
                        {{ run_form.video_language}}

                    </div>
                </div>


                <div class="field-title">{% trans "LENGTH" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <ul>
                            <li>{% trans "Length of course, in number of weeks" %}</li>
                            <li>{% trans "If the time between start/end dates is not exact, ex: 8.5 weeks, " %}
                                {% trans "indicate whether the course should be listed as 8 weeks or 9 weeks." %}
                            </li>
                        </ul>
                    </div>
                    <div class="col col-6">
                        <label class="field-label ">{{ run_form.length.label_tag }}</label>
                        {{ run_form.length}}
                    </div>
                </div>

                <div class="field-title">{% trans "LEVEL TYPE" %}</div>
                <div class="row">
                    <div class="col col-6 help-text">
                        <ul>
                            <li>{% trans "Introductory - No prerequisites; an individual with some to all of a secondary school degree could complete" %}
                            </li>
                            <li>
                                {% trans "Intermediate - Basic prerequisites; a secondary school degree likely required to be successful as well as some university" %}
                            </li>
                            <li>
                                {% trans "Advanced - Significant number of prerequisites required; course geared to 3rd or 4th year university student or a masters degree student" %}
                            </li>
                        </ul>
                    </div>
                    <div class="col col-6 help-text">
                        <label class="field-label ">{{ course_form.level_type.label_tag }}</label>
                        {{ course_form.level_type }}
                    </div>
                </div>
            </fieldset>
        </div>
    </div>
</div>

<div class="layout-full publisher-layout layout">
    <div class="card course-form">
        <div class="course-information">
            <fieldset class="form-group grid-container grid-manual">
                <button class="btn-brand btn-base" type="submit">{% trans "Save Draft" %}</button>

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

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

{% block extra_js %}
    <script src="{% static 'js/publisher/publisher.js' %}"></script>
    <script src="{% static 'js/publisher/seat-type-change.js' %}"></script>
    {{ run_form.media }}
{% endblock %}