<%! from django.core.urlresolvers import reverse %>
<%inherit file="main.html" />

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

<section class="container dashboard">

  <section class="profile-sidebar">
    <header class="profile">
      <h1 class="user-name">${ user.username }</h1>
      <section class="user-info">
        <ul>
          <li>
          <div class="icon email-icon"></div><p>Email<span>${ user.email }</span></p>
          </li>
          <li>
            <div class="icon location-icon"></div><p>Location<span>${ user.profile.location }</span></p>
          </li>
          <li>
            <div class="icon language-icon"></div><p>Language<span>${ user.profile.language }</span></p>
          </li>
        </ul>
      </section>
    </header>
  </section>

  <section class="my-courses">
    <header>
      <h2>Current Courses</h2>
    </header>

    % if len(courses) > 0:
      % for course in courses:

        <article class="my-course">
          <a href="${reverse('info', args=[course.id])}" class="cover" style="background-image: url('static/images/courses/python.png')">
            <div class="shade"></div>
            <div class="arrow"></div>
          </a>
          <section class="info">
            <hgroup>
              <a href="#" class="university">${course.get_about_section('university')}</a>
              <h3><a href="${reverse('info', args=[course.id])}">${course.get_about_section("title")}</a></h3>
            </hgroup>
            <section class="course-status">
              <p>Class Starts - <span>9/2/2012</span></div>
            </section>
            <section class="meta">
              <div class="course-work-icon"></div>
              <div class="progress">
                <div class="meter">
                  <div class="meter-fill"></div>
                </div>
              </div>
              <div class="complete">
                <p><span class="completeness">60%</span> compleat</p>
              </div>
            </section>
          </section>
        </article>

      % endfor
    % else:
      <section class="empty-dashboard-message">
        <p>Looks like you haven't registered for any courses yet.</p>
        <a href="${reverse('courses')}">Find courses now!</a>
      </section>
    % endif

  </section>
</section>
