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

<!-- TODO decode course # from context_course into title -->
<%block name="title">Course Updates</%block>
<%block name="bodyclass">is-signedin course course-info updates</%block>


<%block name="jsextra">
  <script type="text/javascript" src="${static.url('js/template_loader.js')}"></script>
  <script type="text/javascript" src="${static.url('js/models/course_info.js')}"></script>
  <script type="text/javascript" src="${static.url('js/models/module_info.js')}"></script>
  <script type="text/javascript" src="${static.url('js/views/course_info_edit.js')}"></script>
  <script type="text/javascript" src="${static.url('js/views/server_error.js')}"></script>
  <link rel="stylesheet" type="text/css" href="${static.url('js/vendor/timepicker/jquery.timepicker.css')}" />
  <script src="${static.url('js/vendor/timepicker/jquery.timepicker.js')}"></script>
  <script src="${static.url('js/vendor/timepicker/datepair.js')}"></script>
  <script src="${static.url('js/vendor/date.js')}"></script>
  
  <script type="text/javascript" charset="utf-8">
  $(document).ready(function(){
    var course_updates = new CMS.Models.CourseUpdateCollection();
    course_updates.urlbase = '${url_base}';
    course_updates.fetch();

    var course_handouts = new CMS.Models.ModuleInfo({
        id: '${handouts_location}'
      });
    course_handouts.urlbase = '${url_base}';
    
    var editor = new CMS.Views.CourseInfoEdit({
      el: $('.main-wrapper'),
      model : new CMS.Models.CourseInfo({
        courseId : '${context_course.location}',
        updates : course_updates,
        handouts : course_handouts
        })
    });
    editor.render();
  });
  </script>
</%block>

<%block name="content">
  <div class="wrapper-mast wrapper">
    <header class="mast has-actions has-subtitle">
      <div class="title">
        <span class="title-sub">Course Content</span>
        <h1 class="title-1">Course Updates</h1>
      </div>

      <nav class="nav-actions">
        <h3 class="sr">Page Actions</h3>
        <ul>
          <li class="nav-item">
            <a href="#" class=" button new-button new-update-button"><i class="ss-icon ss-symbolicons-standard icon icon-create">&#x002B;</i> New Update</a>
          </li>
        </ul>
      </nav>
    </header>
  </div>

  <div class="wrapper-content wrapper">
    <section class="content">
      <div class="introduction">
        <p clas="copy">Course updates are announcements or notifications you want to share with your class. Other course authors have used them for important exam/date reminders, change in schedules, and to call out any important steps students need to be aware of.</p>
      </div>
    </section>
  </div>

  <div class="main-wrapper">
    <div class="inner-wrapper">
      <div class="course-info-wrapper">
        <div class="main-column window">
          <article class="course-updates" id="course-update-view">
            <ol class="update-list" id="course-update-list"></ol>
          </article>
        </div>
        <div class="sidebar window course-handouts" id="course-handouts-view"></div>
      </div>
    </div>
  </div>
</%block>