{% extends "base.html" %}
{% load url from future %}

{% block pagestyle %}
  <link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/note_course_pages.css">
{% endblock %}

{% block pagescripts %}
  <script src="{{ STATIC_URL }}js/note-iframe.js" ></script>
{% endblock %}

{% block content %}
  <section id="note_content">

    <div id="course_header"> 
      <div class="row">
        <div id="breadcrumbs" class="ten columns offset-by-one">
          <a href="/">Home</a> &gt; 
          <a href="{{ note.course.get_absolute_url }}">{{ note.course.name }}</a> &gt;
          <a href="{{ note.get_absolute_url }}"> {{ note.name }} </a>
        </div><!-- /course_subhead -->
      </div>

      <div class="row">
        <div id="course_name" class="twelve columns">
          {{ note.name }}
        </div><!-- /note_name -->
      </div>

      <div class="row">
        <div class="ten columns offset-by-one">
          <hr/>
        </div>
      </div>

    </div><!-- /course_header -->
    <div id="note_container">

      <div class="row">
        <div class="eight columns centered body_copy">

          <div class="note-text">
            <iframe style="border:none; width:100%;" id="noteframe" src="/raw/{{ note.id }}" onload="autoResize('noteframe')">
            </iframe>
          </div> <!-- .note-text -->
          <div class="note-error" style="display:none">
            This document's content is currently unavailable. It's likely the document is still being processed. Please try again later.
          </div>

        </div><!-- /body_copy -->
      </div>

    </div><!-- /note_container -->


  </section><!--/note_content-->
{% endblock %}