<%inherit file="base.html" />
<%!
from django.utils.translation import ugettext as _
from django.core.urlresolvers import reverse

from openedx.core.djangolib.js_utils import (
    dump_js_escaped_json, js_escaped_string
)
%>
<%def name="online_help_token()"><% return "team_course" %></%def>
<%block name="title">${_("Course Team Settings")}</%block>
<%block name="bodyclass">is-signedin course users view-team</%block>
<%namespace name='static' file='static_content.html'/>

<%block name="header_extras">
<script type="text/template" id="team-member-tpl">
    <%static:include path="js/team-member.underscore" />
</script>
</%block>

<%block name="content">

<div class="wrapper-mast wrapper">
  <header class="mast has-actions has-subtitle">
    <h1 class="page-header">
      <small class="subtitle">${_("Settings")}</small>
      <span class="sr">&gt; </span>${_("Course Team")}
    </h1>

    <nav class="nav-actions" aria-label="${_('Page Actions')}">
      <h3 class="sr">${_("Page Actions")}</h3>
      <ul>
        %if allow_actions:
        <li class="nav-item">
          <a href="#" class="button new-button create-user-button"><span class="icon fa fa-plus" aria-hidden="true"></span> ${_("New Team Member")}</a>
        </li>
        %endif
      </ul>
    </nav>
  </header>
</div>

<div class="wrapper-content wrapper">
  <section class="content">
    <article class="content-primary" role="main">
      %if allow_actions:
      <div class="wrapper-create-element animate wrapper-create-user">
        <form class="form-create create-user" id="create-user-form" name="create-user-form">
          <div class="wrapper-form">
            <h3 class="title">${_("Add a User to Your Course's Team")}</h3>

            <fieldset class="form-fields">
              <legend class="sr">${_("New Team Member Information")}</legend>

                <ol class="list-input">
                  <li class="field text required create-user-email">
                    <label for="user-email-input">${_("User's Email Address")}</label>
                    <input id="user-email-input" class="user-email-input" name="user-email" type="text" placeholder="${_('example: username@domain.com')}" value="">
                    <span class="tip tip-stacked">${_("Provide the email address of the user you want to add as Staff")}</span>
                  </li>
                </ol>
            </fieldset>
          </div>

          <div class="actions">
            <button class="action action-primary" type="submit">${_("Add User")}</button>
            <button class="action action-secondary action-cancel">${_("Cancel")}</button>
          </div>
        </form>
      </div>
      %endif

      <ol class="user-list" id="user-list">
        <div class="ui-loading">
          <p><span class="spin"><span class="icon fa fa-refresh" aria-hidden="true"></span></span> <span class="copy">${_('Loading')}</span></p>
        </div>
      </ol>

      % if allow_actions and len(users) == 1:
      <div class="notice notice-incontext notice-create has-actions">
        <div class="msg">
          <h3 class="title">${_('Add Team Members to This Course')}</h3>
          <div class="copy">
            <p>${_('Adding team members makes course authoring collaborative. Users must be signed up for {studio_name} and have an active account.').format(studio_name=settings.STUDIO_SHORT_NAME)}</p>
          </div>
        </div>

        <ul class="list-actions">
          <li class="action-item">
            <a href="#" class="action action-primary button new-button create-user-button"><span class="icon fa fa-plus icon-inline" aria-hidden="true"></span> ${_('Add a New Team Member')}</a>
          </li>
        </ul>
      </div>
      %endif
    </article>

    <aside class="content-supplementary" role="complementary">
      <div class="bit">
        <h3 class="title-3">${_("Course Team Roles")}</h3>
        <p>${_("Course team members with the Staff role are course co-authors. They have full writing and editing privileges on all course content.")}</p>
        ## Note that the "Admin" role below is identified as "Instructor" in the Django admin panel.
        <p>${_("Admins are course team members who can add and remove other course team members.")}</p>
        <p>${_("All course team members can access content in Studio, the LMS, and Insights, but are not automatically enrolled in the course.")}</p>
      </div>

      % if show_transfer_ownership_hint:
      <div class="bit">
        <h3 class="title-3">${_("Transferring Ownership")}</h3>
        <p>${_("Every course must have an Admin. If you are the Admin and you want to transfer ownership of the course, click <strong>Add admin access</strong> to make another user the Admin, then ask that user to remove you from the Course Team list.")}</p>
      </div>
      % endif
    </aside>
  </section>
</div>
</%block>

<%block name="requirejs">
  require(["js/factories/manage_users"], function(ManageCourseUsersFactory) {
      ManageCourseUsersFactory(
        "${context_course.display_name_with_default | h}",
        ${users | n, dump_js_escaped_json},
        "${reverse('course_team_handler', kwargs={'course_key_string': unicode(context_course.id), 'email': '@@EMAIL@@'}) | n, js_escaped_string}",
        ${request.user.id | n, dump_js_escaped_json},
        ${allow_actions | n, dump_js_escaped_json}
      );
  });
</%block>