<%! from django.utils.translation import ugettext as _ %>

<%inherit file="base.html" />
<%def name="online_help_token()"><% return "home" %></%def>
<%block name="title">${_("My Courses")}</%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">${_("My Courses")}</h1>

    % if user.is_active:
    <nav class="nav-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"><i class="icon-plus icon-inline"></i>
              ${_("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
        </li>
      </ul>
    </nav>
    % endif
  </header>
</div>

<div class="wrapper-content wrapper">
  % if user.is_active:
  <section class="content">
    <article class="content-primary" role="main">

      <div class="introduction">
        <h2 class="title">${_("Welcome, {0}!").format(user.username)}</h2>

        %if len(courses) > 0:
        <div class="copy">
          <p>${_("Here are all of the courses you currently have access to in Studio:")}</p>
        </div>

        %else:
        <div class="copy">
          <p>${_("You currently aren't associated with any Studio Courses.")}</p>
        </div>
        %endif
      </div>

      % 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>
                  <input class="new-course-name" id="new-course-name" type="text" name="new-course-name" aria-required="true" placeholder="${_('e.g. Introduction to Computer Science')}" />
                  <span class="tip">${_("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"></span>
                </li>
                <li class="field text required" id="field-organization">
                  <label for="new-course-org">${_("Organization")}</label>
                  <input class="new-course-org" id="new-course-org" type="text" name="new-course-org" aria-required="true" placeholder="${_('e.g. UniversityX or OrganizationX')}" />
                  <span class="tip">${_("The name of the organization sponsoring the course.")}  <strong>${_("Note: This is part of your course URL, so no spaces or special characters are allowed.")}</strong> ${_("This cannot be changed, but you can set a different display name in Advanced Settings later.")}</span>
                  <span class="tip tip-error is-hiding"></span>
                </li>

                <li class="field text required" id="field-course-number">
                  <label for="new-course-number">${_("Course Number")}</label>
                  <input class="new-course-number" id="new-course-number" type="text" name="new-course-number" aria-required="true" placeholder="${_('e.g. CS101')}" />
                  <span class="tip">${_("The unique number that identifies your course within your organization.")} <strong>${_("Note: This is part of your course URL, so no spaces or special characters are allowed and it cannot be changed.")}</strong></span>
                  <span class="tip tip-error is-hiding"></span>
                </li>

                <li class="field text required" id="field-course-run">
                  <label for="new-course-run">${_("Course Run")}</label>
                  <input class="new-course-run" id="new-course-run" type="text" name="new-course-run" aria-required="true"placeholder="${_('e.g. 2014_T1')}" />
                  <span class="tip">${_("The term in which your course will run.")} <strong>${_("Note: This is part of your course URL, so no spaces or special characters are allowed and it cannot be changed.")}</strong></span>
                  <span class="tip tip-error is-hiding"></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

      <!-- 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'] | h}">
              <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">
                    <i class="icon icon-refresh icon-spin"></i>
                    ## 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">${_('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='<a href="#" class="action-reload">',
                    link_end='</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'] | h}">
              <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">
                  <dt class="label sr">This re-run processing status:</dt>
                  <dd class="value">
                    <i class="icon icon-warning-sign"></i>
                    <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']}">
                      <i class="icon icon-remove-sign"></i>
                      <span class="button-copy">${_("Dismiss")}</span>
                    </a>
                  </li>
                </ul>
              </div>
            </li>
            %endif
            %endfor
          </ul>
      </div>
      %endif

      %if len(courses) > 0:
      <div class="courses">
        <ul class="list-courses">
          %for course_info in sorted(courses, key=lambda s: s['display_name'].lower() if s['display_name'] is not None else ''):
          <li class="course-item" data-course-key="${course_info['course_key'] | h}">
            <a class="course-link" href="${course_info['url']}">
              <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>
            </a>

            <ul  class="item-actions course-actions">
              % if allow_course_reruns and rerun_creator_status and course_creator_status=='granted':
              <li class="action action-rerun">
                <a href="${course_info['rerun_link']}" class="button rerun-button">${_("Re-run Course")}</a>
              </li>
              % endif
              <li class="action action-view">
                <a href="${course_info['lms_link']}" rel="external" class="button view-button">${_("View Live")}</a>
              </li>
            </ul>
          </li>
          %endfor
        </ul>
      </div>

      %else:
      <div class="courses">
      </div>

      <div class="notice notice-incontext notice-instruction notice-instruction-nocourses list-notices">
        <div class="notice-item">
          <div class="msg">
            <h3 class="title">${_("Are you staff on an existing Studio course?")}</h3>
            <div class="copy">
              <p>${_('You will need to be added to the course in Studio by the course creator. Please get in touch with the course creator or administrator for the specific 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"><i class="icon-plus icon-inline"></i> ${_('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')}</span> <i class="icon-remove-sign"></i></a>
        </h3>

        <div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
          <div class="copy">
            <p>${_('edX Studio 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 edX. Our team will evaluate your request and provide you feedback within 24 hours during the work week.')}</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"><i class="icon-cog icon-inline icon-spin"></i> <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> <i class="icon-remove-sign"></i></a>
        </h3>

        <div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
          <div class="copy">
            <p>${_('edX Studio 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 edX. Our team is has completed evaluating your request.')}</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 edX Staff.')}</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> <i class="icon-remove-sign"></i></a>
        </h3>

        <div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
          <div class="copy">
            <p>${_('edX Studio 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 edX. Our team is currently  evaluating your request.')}</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 edX staff and should be updated shortly.')}</span>
              </dd>
            </dl>
          </div>
        </div>
      </div>
      % endif

    </article>
    <aside class="content-supplementary" role="complementary">
      <div class="bit">
        <h3 class="title title-3">${_('New to edX Studio?')}</h3>
        <p>${_('Click Help in the upper-right corner to get more information about the Studio page you are viewing. You can also use the links at the bottom of the page to access our continously updated documentation and other Studio resources.')}</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 edX Studio")}</a>
          </li>
          <li class="action-item">
            <a href="http://help.edge.edx.org/discussion/new" class="show-tender" title="${_("Use our feedback tool, Tender, to request help")}">${_("Request help with edX Studio")}</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?")}</h3>
        <p>${_("In order to create courses in Studio, you must {link_start}contact edX staff to help you create a course{link_end}.").format(
            link_start='<a href="mailto:{email}">'.format(email=settings.FEATURES.get('STUDIO_REQUEST_EMAIL','')),
            link_end="</a>",
          )}</p>
      </div>
      % endif

      % if course_creator_status == "unrequested":
      <div class="bit">
        <h3 class="title title-3">${_("Can I create courses in Studio?")}</h3>
        <p>${_('In order to create courses in Studio, you must have course creator privileges to create your own course.')}</p>
      </div>

      % elif course_creator_status == "denied":
      <div class="bit">
        <h3 class="title title-3">${_("Can I create courses in Studio?")}</h3>
        <p>${_("Your request to author courses in Studio has been denied. Please {link_start}contact edX Staff with further questions{link_end}.").format(
            link_start='<a href="{url}" class="show-tender">'.format(
              url="http://help.edge.edx.org/discussion/new",
            ),
            link_end="</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)s!") % dict(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)s). An activation message and next steps should be waiting for you there.') % dict(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>

        <ol class='list-actions'>
          <li class="action-item">
            <a href="http://help.edge.edx.org/discussion/new" class="show-tender" title="${_("Use our feedback tool, Tender, to request help")}">${_("Request help with your Studio account")}</a>
          </li>
        </ol>
      </div>
    </aside>
  </section>

  %endif
</div>
</%block>
