<%inherit file="base.html" />
<%def name="online_help_token()"><% return "checklist" %></%def>
<%!
  from django.core.urlresolvers import reverse
  from django.utils.translation import ugettext as _
%>
<%block name="title">${_("Course Checklists")}</%block>
<%block name="bodyclass">is-signedin course view-checklists</%block>

<%namespace name='static' file='static_content.html'/>

<%block name="header_extras">
% for template_name in ["checklist"]:
  <script type="text/template" id="${template_name}-tpl">
    <%static:include path="js/${template_name}.underscore" />
  </script>
% endfor
</%block>

<%block name="requirejs">
  require(["js/factories/checklists"], function (ChecklistsFactory) {
    ChecklistsFactory("${handler_url}");
  });
</%block>


<%block name="content">
<div class="wrapper-mast wrapper">
  <header class="mast has-actions has-subtitle">
    <h1 class="page-header">
      <small class="subtitle">${_("Tools")}</small>
      <span class="sr">&gt; </span>${_("Course Checklists")}
    </h1>
  </header>
</div>

<div class="wrapper-content wrapper">
  <section class="content">
    <article class="content-primary" role="main">
      <form id="course-checklists" class="course-checklists" method="post" action="">
        <h2 class="title title-3 sr">${_("Current Checklists")}</h2>
      </form>
    </article>

    <aside class="content-supplementary" role="complementary">
      <div class="bit">
        <h3 class="title title-3">${_("What are course checklists?")}</h3>
        <p>
          ${_("Course checklists are tools to help you understand and keep track of all the steps necessary to get your course ready for students.")}
        </p>
        <p>
          ${_("Any changes you make to these checklists are saved automatically and are immediately visible to other course team members.")}
        </p>
      </div>

      <div class="bit">
        <h3 class="title title-3">${_("{studio_name} checklists").format(studio_name=settings.STUDIO_SHORT_NAME)}</h3>
        <nav class="nav-page checklists-current">
          <ol>
            % for checklist in checklists:
            <li class="nav-item">
              <a rel="view" href="${'#course-checklist' + str(loop.index)}">${checklist['short_description']}</a>
            </li>
            % endfor
          </ol>
        </nav>
      </div>
    </aside>
  </section>
</div>
</%block>