<%page args="course, enrollment, show_courseware_link, cert_status, show_email_settings, course_mode_info, show_refund_option, is_paid_course, is_course_blocked, verification_status, course_requirements" />

<%!
from django.utils.translation import ugettext as _
from django.utils.translation import ungettext
from django.core.urlresolvers import reverse
from markupsafe import escape
from courseware.courses import course_image_url, get_course_about_section
from student.helpers import (
  VERIFY_STATUS_NEED_TO_VERIFY,
  VERIFY_STATUS_SUBMITTED,
  VERIFY_STATUS_APPROVED,
  VERIFY_STATUS_MISSED_DEADLINE,
  VERIFY_STATUS_NEED_TO_REVERIFY
)
%>

<%
  cert_name_short = course.cert_name_short
  if cert_name_short == "":
    cert_name_short = settings.CERT_NAME_SHORT

  cert_name_long = course.cert_name_long
  if cert_name_long == "":
    cert_name_long = settings.CERT_NAME_LONG
  billing_email = settings.PAYMENT_SUPPORT_EMAIL
%>

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

<li class="course-item">
  % if settings.FEATURES.get('ENABLE_VERIFIED_CERTIFICATES'):
    % if enrollment.mode == "verified":
      % if verification_status.get('status') in [VERIFY_STATUS_NEED_TO_VERIFY, VERIFY_STATUS_SUBMITTED, VERIFY_STATUS_APPROVED]:
        <% mode_class = " verified" %>
      % else:
        <% mode_class = " honor" %>
      % endif
    % else:
      <% mode_class = " " + enrollment.mode %>
    % endif
  % else:
    <% mode_class = "" %>
  % endif

  <article class="course${mode_class}">

    <%
      course_target = reverse('info', args=[course.id.to_deprecated_string()])
    %>

    % if show_courseware_link:
      % if not is_course_blocked:
        <a href="${course_target}" class="cover">
        <img src="${course_image_url(course)}" alt="${_('{course_number} {course_name} Home Page').format(course_number=course.number, course_name=course.display_name_with_default) |h}" />
      </a>
        % else:
        <a class="fade-cover">
        <img src="${course_image_url(course)}" alt="${_('{course_number} {course_name} Cover Image').format(course_number=course.number, course_name=course.display_name_with_default) |h}" />
      </a>
        % endif
    % else:
      <div class="cover">
        <img src="${course_image_url(course)}" alt="${_('{course_number} {course_name} Cover Image').format(course_number=course.number, course_name=course.display_name_with_default) | h}" />
      </div>
    % endif
    % if settings.FEATURES.get('ENABLE_VERIFIED_CERTIFICATES'):
      % if enrollment.mode == "verified":
        % if verification_status.get('status') in [VERIFY_STATUS_NEED_TO_VERIFY, VERIFY_STATUS_SUBMITTED]:
          <span class="sts-enrollment" title="${_("Your verification is pending")}">
            <span class="label">${_("Enrolled as: ")}</span>
            ## Translators: This text describes that the student has enrolled for a Verified Certificate, but verification of identity is pending.
            <img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="${_("ID verification pending")}" />
            ## Translators: The student is enrolled for a Verified Certificate, but verification of identity is pending.
            <div class="sts-enrollment-value">${_("Verified: Pending Verification")}</div>
          </span>
        % elif verification_status.get('status') == VERIFY_STATUS_APPROVED:
          <span class="sts-enrollment" title="${_("You're enrolled as a verified student")}">
            <span class="label">${_("Enrolled as: ")}</span>
            <img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="${_("ID Verified Ribbon/Badge")}" />
            <div class="sts-enrollment-value">${_("Verified")}</div>
          </span>
        % else:
          <span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}">
            <span class="label">${_("Enrolled as: ")}</span>
            <div class="sts-enrollment-value">${_("Honor Code")}</div>
          </span>
        % endif
      % elif enrollment.mode == "honor":
        <span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}">
          <span class="label">${_("Enrolled as: ")}</span>
          <div class="sts-enrollment-value">${_("Honor Code")}</div>
        </span>
      % elif enrollment.mode == "audit":
        <span class="sts-enrollment" title="${_("You're auditing this course")}">
          <span class="label">${_("Enrolled as: ")}</span>
          <div class="sts-enrollment-value">${_("Auditing")}</div>
        </span>
      % elif enrollment.mode == "professional":
        <span class="sts-enrollment" title="${_("You're enrolled as a professional education student")}">
        <span class="label">${_("Enrolled as: ")}</span>
        <div class="sts-enrollment-value">${_("Professional Ed")}</div>
      </span>
      % endif
    % endif

    <section class="info">
      <hgroup>
        <p class="date-block">
        % if course.has_ended():
        ${_("Course Completed - {end_date}").format(end_date=course.end_datetime_text("DATE_TIME"))}
        % elif course.has_started():
        ${_("Course Started - {start_date}").format(start_date=course.start_datetime_text("DATE_TIME"))}
        % elif course.start_date_is_still_default: # Course start date TBD
        ${_("Course has not yet started")}
        % else:   # hasn't started yet
        ${_("Course Starts - {start_date}").format(start_date=course.start_datetime_text("DATE_TIME"))}
        % endif
        </p>
        <h2 class="university">${get_course_about_section(course, 'university')}</h2>
        <h3>
          % if show_courseware_link:
             % if not is_course_blocked:
            <a href="${course_target}">${course.display_number_with_default | h} ${course.display_name_with_default}</a>
            % else:
            <a class="disable-look">${course.display_number_with_default | h} ${course.display_name_with_default}</a>
            % endif
          % else:
            <span>${course.display_number_with_default | h} ${course.display_name_with_default}</span>
          % endif
        </h3>
      </hgroup>

      % if course.may_certify() and cert_status:
      <%include file='_dashboard_certificate_information.html' args='cert_status=cert_status,course=course, enrollment=enrollment'/>
      % endif

      % if verification_status.get('status') in [VERIFY_STATUS_NEED_TO_VERIFY, VERIFY_STATUS_SUBMITTED, VERIFY_STATUS_APPROVED, VERIFY_STATUS_NEED_TO_REVERIFY] and not is_course_blocked:
      <div class="message message-status wrapper-message-primary is-shown">
        % if verification_status['status'] == VERIFY_STATUS_NEED_TO_VERIFY:
          <div class="verification-reminder">
            % if verification_status['days_until_deadline'] is not None:
              <h4 class="message-title">${_('Verification not yet complete.')}</h4>
              <p class="message-copy">${ungettext(
                'You only have {days} day left to verify for this course.',
                'You only have {days} days left to verify for this course.',
                verification_status['days_until_deadline']
              ).format(days=verification_status['days_until_deadline'])}</p>
            % else:
              <h4 class="message-title">${_('Almost there!')}</h4>
              <p class="message-copy">${_('You still need to verify for this course.')}</p>
            % endif
          </div>
          <div class="verification-cta">
            <a href="${reverse('verify_student_verify_later', kwargs={'course_id': unicode(course.id)})}" class="cta" data-course-id="${course.id | h}">${_('Verify Now')}</a>
          </div>
        % elif verification_status['status'] == VERIFY_STATUS_SUBMITTED:
          <h4 class="message-title">${_('You have already verified your ID!')}</h4>
          <p class="message-copy">${_('Thanks for your patience as we process your request.')}</p>
        % elif verification_status['status'] == VERIFY_STATUS_APPROVED:
          <h4 class="message-title">${_('You have already verified your ID!')}</h4>
          % if verification_status['verification_good_until'] is not None:
            <p class="message-copy">${_('Your verification status is good until {date}.').format(date=verification_status['verification_good_until'])}
          % endif
        % elif verification_status['status'] == VERIFY_STATUS_NEED_TO_REVERIFY:
          <h4 class="message-title">${_('Your verification will expire soon!')}</h4>
          ## Translators: start_link and end_link will be replaced with HTML tags;
          ## please do not translate these.
          <p class="message-copy">${_('Your current verification will expire before the verification deadline for this course. {start_link}Re-verify your identity now{end_link} using a webcam and a government-issued ID.').format(start_link='<a href="{href}">'.format(href=reverse('verify_student_reverify')), end_link='</a>')}</p>
        % endif
      </div>
      % endif

      % if course_mode_info['show_upsell'] and not is_course_blocked:
        <div class="message message-upsell has-actions is-expandable is-shown">

            <div class="wrapper-tip">
              <h4 class="message-title">
                <i class="icon fa fa-caret-down ui-toggle-expansion"></i>
                  <span class="value">${_("Challenge Yourself!")}</span>
              </h4>
              <p class="message-copy">${_("Take this course as an ID-verified student.")}</p>
            </div>

            <div class="wrapper-extended">
                <p class="message-copy">${_("You can still sign up for an ID verified {cert_name_long} for this course. If you plan to complete the whole course, it is a great way to recognize your achievement. {link_start}Learn more about the verified {cert_name_long}{link_end}.").format(link_start='<a href="{}">'.format(marketing_link('WHAT_IS_VERIFIED_CERT')), link_end="</a>", cert_name_long=cert_name_long)}</p>

              <ul class="actions message-actions">
                <li class="action-item">
                  <a class="action action-upgrade" href="${reverse('verify_student_upgrade_and_verify', kwargs={'course_id': unicode(course.id)})}" data-course-id="${course.id | h}" data-user="${user.username | h}">
                    <img class="deco-graphic" src="${static.url('images/vcert-ribbon-s.png')}" alt="${_("ID Verified Ribbon/Badge")}">
                    <span class="wrapper-copy">
                      <span class="copy" id="upgrade-to-verified">${_("Upgrade to Verified Track")}</span>
                    </span>
                  </a>
                </li>
              </ul>
            </div>
        </div>
      %endif
      % if is_course_blocked:
        <p id="block-course-msg" class="course-block">
          ${_("You can no longer access this course because payment has not yet been received. "
              "You can {contact_link_start}contact the account holder{contact_link_end} "
              "to request payment, or you can "
              "{unenroll_link_start}unenroll{unenroll_link_end} "
              "from this course").format(
            contact_link_start='<a href="#">',
            contact_link_end='</a>',
            unenroll_link_start=(
              '<a id="unregister_block_course" rel="leanModal" '
              'data-course-id="{course_id}" data-course-number="{course_number}" '
              'href="#unenroll-modal">'.format(
                course_id=escape(course.id),
                course_number=escape(course.number),
              )
            ),
            unenroll_link_end="</a>",
          )}
        </p>
      %endif

      % if show_courseware_link:
        % if course.has_ended():
         % if not is_course_blocked:
          <a href="${course_target}" class="enter-course archived">${_('View Archived Course')}</a>
        % else:
          <a class="enter-course-blocked archived">${_('View Archived Course')}</a>
        % endif
        % else:
        % if not is_course_blocked:
          <a href="${course_target}" class="enter-course">${_('View Course')}</a>
        % else:
          <a class="enter-course-blocked">${_('View Course')}</a>
        % endif
        % endif
      % endif

      % if is_paid_course and show_refund_option:
        ## Translators: The course's name will be added to the end of this sentence.
        % if not is_course_blocked:
        <a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the purchased course")}';
        document.getElementById('refund-info').innerHTML=gettext('You will be refunded the amount you paid.')">
          ${_('Unenroll')}
        </a>
        % else:
        <a class="disable-look-unregister" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the purchased course")}';
        document.getElementById('refund-info').innerHTML=gettext('You will be refunded the amount you paid.')">
          ${_('Unenroll')}
        </a>
        % endif
      % elif is_paid_course and not show_refund_option:
        ## Translators: The course's name will be added to the end of this sentence.
        % if not is_course_blocked:
        <a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the purchased course")}';
        document.getElementById('refund-info').innerHTML=gettext('You will not be refunded the amount you paid.')">
          ${_('Unenroll')}
        </a>
        % else:
        <a class="disable-look-unregister" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the purchased course")}';
        document.getElementById('refund-info').innerHTML=gettext('You will not be refunded the amount you paid.')">
          ${_('Unenroll')}
        </a>
        % endif
      % elif enrollment.mode != "verified":
        ## Translators: The course's name will be added to the end of this sentence.
        % if not is_course_blocked:
        <a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from")}'; document.getElementById('refund-info').innerHTML=''">
          ${_('Unenroll')}
        </a>
        % else:
        <a class="disable-look-unregister" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from")}'; document.getElementById('refund-info').innerHTML=''">
          ${_('Unenroll')}
        </a>
        % endif
      % elif show_refund_option:
        ## Translators: The course's name will be added to the end of this sentence.
        % if not is_course_blocked:
        <a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the verified {cert_name_long} track of").format(cert_name_long=cert_name_long)}';
        document.getElementById('refund-info').innerHTML=gettext('You will be refunded the amount you paid.')">
          ${_('Unenroll')}
        </a>
        % else:
        <a class="disable-look-unregister" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the verified {cert_name_long} track of").format(cert_name_long=cert_name_long)}';
        document.getElementById('refund-info').innerHTML=gettext('You will be refunded the amount you paid.')">
          ${_('Unenroll')}
        </a>
        % endif
      % else:
        ## Translators: The course's name will be added to the end of this sentence.
        % if not is_course_blocked:
        <a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the verified {cert_name_long} track of").format(cert_name_long=cert_name_long)}';
        document.getElementById('refund-info').innerHTML=gettext('The refund deadline for this course has passed, so you will not receive a refund.')">
          ${_('Unenroll')}
        </a>
        % else:
        <a class="disable-look-unregister" data-course-id="${course.id | h}" data-course-number="${course.number | h}" onclick="document.getElementById('track-info').innerHTML='${_("Are you sure you want to unenroll from the verified {cert_name_long} track of").format(cert_name_long=cert_name_long)}';
        document.getElementById('refund-info').innerHTML=gettext('The refund deadline for this course has passed, so you will not receive a refund.')">
          ${_('Unenroll')}
        </a>
        % endif
      % endif

% if show_email_settings:
        % if not is_course_blocked:
        <a href="#email-settings-modal" class="email-settings" rel="leanModal" data-course-id="${course.id | h}" data-course-number="${course.number | h}" data-optout="${unicode(course.id) in course_optouts}">${_('Email Settings')}</a>
        % else:
        <a class="disable-look-settings" data-course-id="${course.id| h}" data-course-number="${course.number | h}" data-optout="${unicode(course.id) in course_optouts}">${_('Email Settings')}</a>
        % endif
% endif



  </section>
  % if course_requirements:
  ## Multiple pre-requisite courses are not supported on frontend that's why we are pulling first element
  <% prc_target = reverse('about_course', args=[unicode(course_requirements['courses'][0]['key'])]) %>
  <section class="prerequisites">
    <p class="tip">
      ${_("You must successfully complete {link_start}{prc_display}{link_end} before you begin this course.").format(
          link_start='<a href="{}">'.format(prc_target),
          link_end='</a>',
          prc_display=course_requirements['courses'][0]['display'],
        )}
    </p>
  </section>
  % endif
</article>
</article>
</li>
 <script>
           $( document ).ready(function() {

               if("${is_course_blocked}" == "True"){
                   $( "#unregister_block_course" ).click(function() {
                       $('.disable-look-unregister').click();
                   });
               }
           });
 </script>
