<%! 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>
            <img src=""><p>Email<span>${ user.email }</span></p>
          </li>
          <li>
            <img src=""><p>Location<span>${ user.profile.location }</span></p>
          </li>
          <li>
            <img src=""><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])}">
            <div class="cover">
              <div class="shade"></div>
              <div class="arrow"></div>
              <img src="${static.url('images/circuits.jpeg')}" />
            </div>
            <section class="info">
              <hgroup>
                % for instructor in course.instructors:
                  <h3>${course.get_about_section('university')}</h3>
                % endfor
                <h2>${course.get_about_section("title")}</h2>
              </hgroup>
              <section class="meta">
                <div class="complete">
                  <p>60% complete</p>
                </div>
                <div class="progress">
                  <div class="meter">
                    <div class="meter-fill"></div>
                  </div>
                </div>
                <div class="end-date">
                  <p>End date: <time>6/10/12</time></p>
                </div>
              </section>
            </section>
          </a>
        </article>
      % endfor
    % else:
      <section class="empty-dashboard-message">
        <p>Looks like you aren't registered for any courses. You should take a minute and <a href="${reverse('courses')}" class="find-courses">Find some courses!</a></p>
      </section>
    % endif

    <article class="my-course">
      <a href="/info" class="cover" style="background-image: url('static/images/courses/python.png')">
        <div class="shade"></div>
        <div class="arrow"></div>
      </a>
      <section class="info">
        <hgroup>
          <h3><a href="">HarvardX</a></h3>
          <h2><a href="/info">CS 102 Python</a></h2>
        </hgroup>
      </section>
    </article>

    <article class="my-course">
      <a href="/info" class="cover" style="background-image: url('static/images/courses/python.png')">
        <div class="shade"></div>
        <div class="arrow"></div>
      </a>
      <section class="info">
        <hgroup>
          <h3><a href="">HarvardX</a></h3>
          <h2><a href="/info">CS 102 Python</a></h2>
        </hgroup>
        <section class="meta">
          <div src="" 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>
  </section>

</section>
