<%page expression_filter="h"/>
<%!
from django.utils.translation import ugettext as _
from openedx.core.djangolib.markup import HTML, Text
from openedx.core.djangolib.js_utils import (
dump_js_escaped_json
)
%>
<%inherit file="base.html" />
<%namespace name='static' file='static_content.html'/>
<%def name="online_help_token()"><% return "home" %></%def>
<%block name="title">${_("{studio_name} Home").format(studio_name=settings.STUDIO_SHORT_NAME)}</%block>
<%block name="bodyclass">is-signedin index view-dashboard</%block>
<%block name="requirejs">
require(["js/factories/index"], function (IndexFactory) {
IndexFactory();
});
</%block>
<%block name="content">
<div class="wrapper-mast wrapper">
<header class="mast has-actions">
<h1 class="page-header">${_("{studio_name} Home").format(studio_name=settings.STUDIO_SHORT_NAME)}</h1>
% if user.is_active:
<nav class="nav-actions" aria-label="${_('Page Actions')}">
<h3 class="sr">${_("Page Actions")}</h3>
<ul>
<li class="nav-item">
% if course_creator_status=='granted':
<a href="#" class="button new-button new-course-button"><span class="icon fa fa-plus icon-inline" aria-hidden="true"></span>
${_("New Course")}</a>
% elif course_creator_status=='disallowed_for_this_site' and settings.FEATURES.get('STUDIO_REQUEST_EMAIL',''):
<a href="mailto:${settings.FEATURES.get('STUDIO_REQUEST_EMAIL','')}">${_("Email staff to create course")}</a>
% endif
% if show_new_library_button:
<a href="#" class="button new-button new-library-button"><span class="icon fa fa-plus icon-inline" aria-hidden="true"></span>
${_("New Library")}</a>
% endif
</li>
</ul>
</nav>
% endif
</header>
</div>
<div class="wrapper-content wrapper">
% if user.is_active:
<section class="content">
<article class="content-primary" role="main">
% if course_creator_status=='granted':
<div class="wrapper-create-element wrapper-create-course">
<form class="form-create create-course course-info" id="create-course-form" name="create-course-form">
<div class="wrap-error">
<div id="course_creation_error" name="course_creation_error" class="message message-status message-status error" role="alert">
<p>${_("Please correct the highlighted fields below.")}</p>
</div>
</div>
<div class="wrapper-form">
<h3 class="title">${_("Create a New Course")}</h3>
<fieldset>
<legend class="sr">${_("Required Information to Create a New Course")}</legend>
<ol class="list-input">
<li class="field text required" id="field-course-name">
<label for="new-course-name">${_("Course Name")}</label>
## Translators: This is an example name for a new course, seen when
## filling out the form to create a new course.
<input class="new-course-name" id="new-course-name" type="text" name="new-course-name" required placeholder="${_('e.g. Introduction to Computer Science')}" aria-describedby="tip-new-course-name tip-error-new-course-name" />
<span class="tip" id="tip-new-course-name">${_("The public display name for your course. This cannot be changed, but you can set a different display name in Advanced Settings later.")}</span>
<span class="tip tip-error is-hiding" id="tip-error-new-course-name"></span>
</li>
<li class="field text required">
<label for="new-course-org">${_("Organization")}</label>
## Translators: This is an example for the name of the organization sponsoring a course, seen when filling out the form to create a new course. The organization name cannot contain spaces.
## Translators: "e.g. UniversityX or OrganizationX" is a placeholder displayed when user put no data into this field.
<input class="new-course-org" id="new-course-org" type="text" name="new-course-org" required placeholder="${_('e.g. UniversityX or OrganizationX')}" aria-describedby="tip-new-course-org tip-error-new-course-org" />
<span class="tip" id="tip-new-course-org">${Text(_("The name of the organization sponsoring the course. {strong_start}Note: The organization name is part of the course URL.{strong_end} This cannot be changed, but you can set a different display name in Advanced Settings later.")).format(
strong_start=HTML('<strong>'),
strong_end=HTML('</strong>'),
)}</span>
<span class="tip tip-error is-hiding" id="tip-error-new-course-org"></span>
</li>
<li class="field text required" id="field-course-number">
<label for="new-course-number">${_("Course Number")}</label>
## Translators: This is an example for the number used to identify a course,
## seen when filling out the form to create a new course. The number here is
## short for "Computer Science 101". It can contain letters but cannot contain spaces.
<input class="new-course-number" id="new-course-number" type="text" name="new-course-number" required placeholder="${_('e.g. CS101')}" aria-describedby="tip-new-course-number tip-error-new-course-number" />
<span class="tip" id="tip-new-course-number">${Text(_("The unique number that identifies your course within your organization. {strong_start}Note: This is part of your course URL, so no spaces or special characters are allowed and it cannot be changed.{strong_end}")).format(
strong_start=HTML('<strong>'),
strong_end=HTML('</strong>'),
)}</span>
<span class="tip tip-error is-hiding" id="tip-error-new-course-number"></span>
</li>
<li class="field text required" id="field-course-run">
<label for="new-course-run">${_("Course Run")}</label>
## Translators: This is an example for the "run" used to identify different
## instances of a course, seen when filling out the form to create a new course.
<input class="new-course-run" id="new-course-run" type="text" name="new-course-run" required placeholder="${_('e.g. 2014_T1')}" aria-describedby="tip-new-course-run tip-error-new-course-run" />
<span class="tip" id="tip-new-course-run">${Text(_("The term in which your course will run. {strong_start}Note: This is part of your course URL, so no spaces or special characters are allowed and it cannot be changed.{strong_end}")).format(
strong_start=HTML('<strong>'),
strong_end=HTML('</strong>'),
)}</span>
<span class="tip tip-error is-hiding" id="tip-error-new-course-run"></span>
</li>
</ol>
</fieldset>
</div>
<div class="actions">
<input type="hidden" value="${allow_unicode_course_id}" class="allow-unicode-course-id" />
<input type="submit" value="${_('Create')}" class="action action-primary new-course-save" />
<input type="button" value="${_('Cancel')}" class="action action-secondary action-cancel new-course-cancel" />
</div>
</form>
</div>
% endif
%if libraries_enabled and show_new_library_button:
<div class="wrapper-create-element wrapper-create-library">
<form class="form-create create-library library-info" id="create-library-form" name="create-library-form">
<div class="wrap-error">
<div id="library_creation_error" name="library_creation_error" class="message message-status message-status error" role="alert">
<p>${_("Please correct the highlighted fields below.")}</p>
</div>
</div>
<div class="wrapper-form">
<h3 class="title">${_("Create a New Library")}</h3>
<fieldset>
<legend class="sr">${_("Required Information to Create a New Library")}</legend>
<ol class="list-input">
<li class="field text required" id="field-library-name">
<label for="new-library-name">${_("Library Name")}</label>
## Translators: This is an example name for a new content library, seen when
## filling out the form to create a new library.
## (A library is a collection of content or problems.)
<input class="new-library-name" id="new-library-name" type="text" name="new-library-name" required placeholder="${_('e.g. Computer Science Problems')}" aria-describedby="tip-new-library-name tip-error-new-library-name" />
<span class="tip" id="tip-new-library-name">${_("The public display name for your library.")}</span>
<span class="tip tip-error is-hiding" id="tip-error-new-library-name"></span>
</li>
<li class="field text required">
<label for="new-library-org">${_("Organization")}</label>
<input class="new-library-org" id="new-library-org" type="text" name="new-library-org" required placeholder="${_('e.g. UniversityX or OrganizationX')}" aria-describedby="tip-new-library-org tip-error-new-library-org" />
<span class="tip" id="tip-new-library-org">${_("The public organization name for your library.")} ${_("This cannot be changed.")}</span>
<span class="tip tip-error is-hiding" id="tip-error-new-library-org"></span>
</li>
<li class="field text required" id="field-library-number">
<label for="new-library-number">${_("Library Code")}</label>
## Translators: This is an example for the "code" used to identify a library,
## seen when filling out the form to create a new library. This example is short
## for "Computer Science Problems". The example number may contain letters
## but must not contain spaces.
<input class="new-library-number" id="new-library-number" type="text" name="new-library-number" required placeholder="${_('e.g. CSPROB')}" aria-describedby="tip-new-library-number tip-error-new-library-number" />
<span class="tip" id="tip-new-library-number">${Text(_("The unique code that identifies this library. {strong_start}Note: This is part of your library URL, so no spaces or special characters are allowed.{strong_end} This cannot be changed.")).format(
strong_start=HTML('<strong>'),
strong_end=HTML('</strong>'),
)}</span>
<span class="tip tip-error is-hiding" id="tip-error-new-library-number"></span>
</li>
</ol>
</fieldset>
</div>
<div class="actions">
<input type="hidden" value="${allow_unicode_course_id}" class="allow-unicode-course-id" />
<input type="submit" value="${_('Create')}" class="action action-primary new-library-save" />
<input type="button" value="${_('Cancel')}" class="action action-secondary action-cancel new-library-cancel" />
</div>
</form>
</div>
% endif
%if optimization_enabled:
<div class="optimization-form">
<h2 class="title title-3">${_("Organization and Library Settings")}</h2>
<form class="form" action="/home/" method="GET">
<fieldset class="form-group">
<div class="field">
<label class="field-label">${_("Show all courses in organization:")}
<input class="field-input input-text" type="text" name="org"
placeholder="${_('For example, MITx')}"/>
</label>
</div>
</fieldset>
<div class="form-actions">
<button class="btn-brand btn-base" type="submit">${_("Submit")}</button>
</div>
</form>
</div>
%endif
<!-- STATE: processing courses -->
%if allow_course_reruns and rerun_creator_status and len(in_process_course_actions) > 0:
<div class="courses courses-processing">
<h3 class="title">${_("Courses Being Processed")}</h3>
<ul class="list-courses">
%for course_info in sorted(in_process_course_actions, key=lambda s: s['display_name'].lower() if s['display_name'] is not None else ''):
<!-- STATE: re-run is processing -->
%if course_info['is_in_progress']:
<li class="wrapper-course has-status" data-course-key="${course_info['course_key']}">
<div class="course-item course-rerun is-processing">
<div class="course-details" href="#">
<h3 class="course-title">${course_info['display_name']}</h3>
<div class="course-metadata">
<span class="course-org metadata-item">
<span class="label">${_("Organization:")}</span> <span class="value">${course_info['org']}</span>
</span>
<span class="course-num metadata-item">
<span class="label">${_("Course Number:")}</span>
<span class="value">${course_info['number']}</span>
</span>
<span class="course-run metadata-item">
<span class="label">${_("Course Run:")}</span> <span class="value">${course_info['run']}</span>
</span>
</div>
</div>
<dl class="course-status">
<dt class="label sr">${_("This course run is currently being created.")}</dt>
<dd class="value">
<span class="icon fa fa-refresh fa-spin" aria-hidden="true"></span>
## Translators: This is a status message, used to inform the user of
## what the system is doing. This status means that the user has
## requested to re-run an existing course, and the system is currently
## in the process of duplicating and configuring the existing course
## so that it can be re-run.
<span class="copy">${_("Configuring as re-run")}</span>
</dd>
</dl>
</div>
<div class="status-message">
<p class="copy">${Text(_('The new course will be added to your course list in 5-10 minutes. Return to this page or {link_start}refresh it{link_end} to update the course list. The new course will need some manual configuration.')).format(
link_start=HTML('<a href="#" class="action-reload">'),
link_end=HTML('</a>'),
)}</p>
</div>
</li>
%endif
<!-- - - - -->
<!-- STATE: re-run has error -->
%if course_info['is_failed']:
<li class="wrapper-course has-status" data-course-key="${course_info['course_key']}">
<div class="course-item course-rerun has-error">
<div class="course-details" href="#">
<h3 class="course-title">${course_info['display_name']}</h3>
<div class="course-metadata">
<span class="course-org metadata-item">
<span class="label">${_("Organization:")}</span> <span class="value">${course_info['org']}</span>
</span>
<span class="course-num metadata-item">
<span class="label">${_("Course Number:")}</span>
<span class="value">${course_info['number']}</span>
</span>
<span class="course-run metadata-item">
<span class="label">${_("Course Run:")}</span> <span class="value">${course_info['run']}</span>
</span>
</div>
</div>
<dl class="course-status">
## Translators: This is a status message for the course re-runs feature.
## When a course admin indicates that a course should be re-run, the system
## needs to process the request and prepare the new course. The status of
## the process will follow this text.
<dt class="label sr">${_("This re-run processing status:")}</dt>
<dd class="value">
<span class="icon fa fa-warning" aria-hidden="true"></span>
<span class="copy">${_("Configuration Error")}</span>
</dd>
</dl>
</div>
<div class="status-message has-actions">
<p class="copy">${_("A system error occurred while your course was being processed. Please go to the original course to try the re-run again, or contact your PM for assistance.")}</p>
<ul class="status-actions">
<li class="action action-dismiss">
<a href="#" class="button dismiss-button" data-dismiss-link="${course_info['dismiss_link']}">
<span class="icon fa fa-times-circle" aria-hidden="true"></span>
<span class="button-copy">${_("Dismiss")}</span>
</a>
</li>
</ul>
</div>
</li>
%endif
%endfor
</ul>
</div>
%endif
% if libraries_enabled or archived_courses:
<ul id="course-index-tabs">
<li class="courses-tab active"><a>${_("Courses")}</a></li>
% if archived_courses:
<li class="archived-courses-tab"><a>${_("Archived Courses")}</a></li>
% endif
% if libraries_enabled:
<li class="libraries-tab"><a>${_("Libraries")}</a></li>
% endif
</ul>
% endif
%if len(courses) > 0 or optimization_enabled:
<div class="courses courses-tab react-course-listing active"></div>
%else:
<div class="notice notice-incontext notice-instruction notice-instruction-nocourses list-notices courses-tab active">
<div class="notice-item">
<div class="msg">
<h3 class="title">${_("Are you staff on an existing {studio_name} course?").format(studio_name=settings.STUDIO_SHORT_NAME)}</h3>
<div class="copy">
<p>${_('The course creator must give you access to the course. Contact the course creator or administrator for the course you are helping to author.')}</p>
</div>
</div>
</div>
%if course_creator_status == "granted":
<div class="notice-item has-actions">
<div class="msg">
<h3 class="title">${_('Create Your First Course')}</h3>
<div class="copy">
<p>${_('Your new course is just a click away!')}</p>
</div>
</div>
<ul class="list-actions">
<li class="action-item">
<a href="#" class="action-primary action-create action-create-course new-course-button"><span class="icon fa fa-plus icon-inline" aria-hidden="true"></span> ${_('Create Your First Course')}</a>
</li>
</ul>
</div>
% endif
</div>
% endif
%if course_creator_status == "unrequested":
<div class="wrapper wrapper-creationrights">
<h3 class="title">
<a href="#instruction-creationrights" class="ui-toggle-control show-creationrights"><span class="label">${_('Becoming a Course Creator in {studio_name}').format(studio_name=settings.STUDIO_SHORT_NAME)}</span> <span class="icon fa fa-times-circle" aria-hidden="true"></span></a>
</h3>
<div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
<div class="copy">
<p>${_('{studio_name} is a hosted solution for our xConsortium partners and selected guests. Courses for which you are a team member appear above for you to edit, while course creator privileges are granted by {platform_name}. Our team will evaluate your request and provide you feedback within 24 hours during the work week.').format(
studio_name=settings.STUDIO_NAME, platform_name=settings.PLATFORM_NAME)}</p>
</div>
<div class="status status-creationrights is-unrequested">
<h4 class="title">${_('Your Course Creator Request Status:')}</h4>
<form id="request-coursecreator" action="${request_course_creator_url}" method="post" enctype="multipart/form-data">
<div class="form-actions">
<button type="submit" id="request-coursecreator-submit" name="request-coursecreator-submit" class="action-primary action-request"><span class="icon fa fa-cog icon-inline fa fa-spin" aria-hidden="true"></span> <span class="label">${_('Request the Ability to Create Courses')}</span></button>
</div>
</form>
</div>
</div>
</div>
%elif course_creator_status == "denied":
<div class="wrapper wrapper-creationrights is-shown">
<h3 class="title">
<a href="#instruction-creationrights" class="ui-toggle-control current show-creationrights"><span class="label">${_('Your Course Creator Request Status')}</span> <span class="icon fa fa-times-circle" aria-hidden="true"></span></a>
</h3>
<div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
<div class="copy">
<p>${_('{studio_name} is a hosted solution for our xConsortium partners and selected guests. Courses for which you are a team member appear above for you to edit, while course creator privileges are granted by {platform_name}. Our team is has completed evaluating your request.').format(
studio_name=settings.STUDIO_NAME, platform_name=settings.PLATFORM_NAME,
)}</p>
</div>
<div class="status status-creationrights has-status is-denied">
<h4 class="title">${_('Your Course Creator Request Status:')}</h4>
<dl class="status-update">
<dt class="label">${_('Your Course Creator request is:')}</dt>
<dd class="value">
<span class="status-indicator"></span>
<span class="value-formal">${_('Denied')}</span>
<span class="value-description">${_('Your request did not meet the criteria/guidelines specified by {platform_name} Staff.').format(platform_name=settings.PLATFORM_NAME)}</span>
</dd>
</dl>
</div>
</div>
</div>
%elif course_creator_status == "pending":
<div class="wrapper wrapper-creationrights is-shown">
<h3 class="title">
<a href="#instruction-creationrights" class="ui-toggle-control current show-creationrights"><span class="label">${_('Your Course Creator Request Status')}</span> <span class="icon fa fa-times-circle" aria-hidden="true"></span></a>
</h3>
<div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
<div class="copy">
<p>${_('{studio_name} is a hosted solution for our xConsortium partners and selected guests. Courses for which you are a team member appear above for you to edit, while course creator privileges are granted by {platform_name}. Our team is currently evaluating your request.').format(
studio_name=settings.STUDIO_NAME, platform_name=settings.PLATFORM_NAME,
)}</p>
</div>
<div class="status status-creationrights has-status is-pending">
<h4 class="title">${_('Your Course Creator Request Status:')}</h4>
<dl class="status-update">
<dt class="label">${_('Your Course Creator request is:')}</dt>
<dd class="value">
<span class="status-indicator"></span>
<span class="value-formal">${_('Pending')}</span>
<span class="value-description">
${_('Your request is currently being reviewed by {platform_name} staff and should be updated shortly.').format(platform_name=settings.PLATFORM_NAME)}
</span>
</dd>
</dl>
</div>
</div>
</div>
% endif
%if archived_courses:
<div class="archived-courses react-archived-course-listing archived-courses-tab"></div>
%endif
%if len(libraries) > 0 or optimization_enabled:
<div class="libraries react-library-listing libraries-tab"></div>
%else:
<div class="notice notice-incontext notice-instruction notice-instruction-nocourses list-notices libraries-tab">
<div class="notice-item">
<div class="msg">
<h3 class="title">${_("Were you expecting to see a particular library here?")}</h3>
<div class="copy">
<p>${_('The library creator must give you access to the library. Contact the library creator or administrator for the library you are helping to author.')}</p>
</div>
</div>
</div>
% if show_new_library_button:
<div class="notice-item has-actions">
<div class="msg">
<h3 class="title">${_('Create Your First Library')}</h3>
<div class="copy">
<p>${_('Libraries hold a pool of components that can be re-used across multiple courses. Create your first library with the click of a button!')}</p>
</div>
</div>
<ul class="list-actions">
<li class="action-item">
<a href="#" class="action-primary action-create new-button action-create-library new-library-button"><span class="icon fa fa-plus icon-inline" aria-hidden="true"></span> ${_('Create Your First Library')}</a>
</li>
</ul>
</div>
% endif
</div>
%endif
</article>
<aside class="content-supplementary" role="complementary">
<div class="bit">
<h3 class="title title-3">${_('New to {studio_name}?').format(studio_name=settings.STUDIO_NAME)}</h3>
<p>${_('Click Help in the upper-right corner to get more information about the {studio_name} page you are viewing. You can also use the links at the bottom of the page to access our continually updated documentation and other {studio_name} resources.').format(studio_name=settings.STUDIO_SHORT_NAME)}</p>
<ol class="list-actions">
<li class="action-item">
<a href="${get_online_help_info(online_help_token())['doc_url']}" target="_blank">${_("Getting Started with {studio_name}").format(studio_name=settings.STUDIO_NAME)}</a>
</li>
</ol>
</div>
% if course_creator_status=='disallowed_for_this_site' and settings.FEATURES.get('STUDIO_REQUEST_EMAIL',''):
<div class="bit">
<h3 class="title title-3">${_("Can I create courses in {studio_name}?").format(studio_name=settings.STUDIO_NAME)}</h3>
<p>${Text(_("In order to create courses in {studio_name}, you must {link_start}contact {platform_name} staff to help you create a course{link_end}.")).format(
studio_name=settings.STUDIO_NAME,
platform_name=settings.PLATFORM_NAME,
link_start=HTML('<a href="mailto:{email}">').format(email=settings.FEATURES.get('STUDIO_REQUEST_EMAIL','')),
link_end=HTML("</a>"),
)}</p>
</div>
% endif
% if course_creator_status == "unrequested":
<div class="bit">
<h3 class="title title-3">${_("Can I create courses in {studio_name}?").format(studio_name=settings.STUDIO_NAME)}</h3>
<p>${_('In order to create courses in {studio_name}, you must have course creator privileges to create your own course.').format(studio_name=settings.STUDIO_NAME)}</p>
</div>
% elif course_creator_status == "denied":
<div class="bit">
<h3 class="title title-3">${_("Can I create courses in {studio_name}?").format(studio_name=settings.STUDIO_NAME)}</h3>
<p>${Text(_("Your request to author courses in {studio_name} has been denied. Please {link_start}contact {platform_name} Staff with further questions{link_end}.")).format(
studio_name=settings.STUDIO_NAME,
platform_name=settings.PLATFORM_NAME,
link_start=HTML('<a href="mailto:{email}">').format(email=settings.TECH_SUPPORT_EMAIL),
link_end=HTML('</a>'),
)}</p>
</div>
% endif
</aside>
</section>
% else:
<section class="content">
<article class="content-primary" role="main">
<div class="introduction">
<h2 class="title">${_("Thanks for signing up, {name}!").format(name=user.username)}</h2>
</div>
<div class="notice notice-incontext notice-instruction notice-instruction-verification">
<div class="msg">
<h3 class="title">${_("We need to verify your email address")}</h3>
<div class="copy">
<p>${_('Almost there! In order to complete your sign up we need you to verify your email address ({email}). An activation message and next steps should be waiting for you there.').format(email=user.email)}</p>
</div>
</div>
</div>
</article>
<aside class="content-supplementary" role="complementary">
<div class="bit">
<h3 class="title title-3">${_('Need help?')}</h3>
<p>${_('Please check your Junk or Spam folders in case our email isn\'t in your INBOX. Still can\'t find the verification email? Request help via the link below.')}</p>
</div>
</aside>
</section>
%endif
</div>
<%static:webpack entry="StudioIndex">
var enableReruns = ${allow_course_reruns and rerun_creator_status and course_creator_status=='granted' | n, dump_js_escaped_json};
new StudioCourseIndex(
".react-course-listing",
${sorted(courses, key=lambda s: s['display_name'].lower() if s['display_name'] is not None else '') | n, dump_js_escaped_json},
enableReruns
);
new StudioArchivedIndex(
".react-archived-course-listing",
${sorted(archived_courses, key=lambda s: s['display_name'].lower() if s['display_name'] is not None else '') | n, dump_js_escaped_json},
enableReruns
);
new StudioLibraryIndex(
".react-library-listing",
${sorted(libraries, key=lambda s: s['display_name'].lower() if s['display_name'] is not None else '') | n, dump_js_escaped_json}
);
</%static:webpack>
</%block>