Files
edx-platform/cms/templates/overview.html
2013-06-25 22:34:29 -04:00

240 lines
11 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<%inherit file="base.html" />
<%!
import logging
from xmodule.util import date_utils
%>
<%! from django.core.urlresolvers import reverse %>
<%block name="title">Course Outline</%block>
<%block name="bodyclass">is-signedin course outline</%block>
<%namespace name='static' file='static_content.html'/>
<%namespace name="units" file="widgets/units.html" />
<%block name="jsextra">
<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" src="${static.url('js/models/course_relative.js')}"></script>
<script type="text/javascript" src="${static.url('js/views/grader-select-view.js')}"></script>
<script type="text/javascript" src="${static.url('js/views/overview.js')}"></script>
<script type="text/javascript" src="${static.url('js/models/settings/course_grading_policy.js')}"></script>
<script type="text/template" id="section-name-edit-tpl">
<%static:include path="js/section-name-edit.underscore" />
</script>
<script type="text/javascript" src="${static.url('js/models/section.js')}"></script>
<script type="text/javascript" src="${static.url('js/views/section.js')}"></script>
<script type="text/javascript">
$(document).ready(function(){
// TODO figure out whether these should be in window or someplace else or whether they're only needed as local vars
// I believe that current (New Section/New Subsection) cause full page reloads which means these aren't needed globally
// but we really should change that behavior.
if (!window.graderTypes) {
window.graderTypes = new CMS.Models.Settings.CourseGraderCollection();
window.graderTypes.course_location = new CMS.Models.Location('${parent_location}');
window.graderTypes.reset(${course_graders|n});
}
$(".gradable-status").each(function(index, ele) {
var gradeView = new CMS.Views.OverviewAssignmentGrader({
el : ele,
graders : window.graderTypes
});
});
$(".section-name").each(function() {
var model = new CMS.Models.Section({
id: $(this).parent(".item-details").data("id"),
name: $(this).data("name")
});
new CMS.Views.SectionShow({model: model, el: this}).render();
})
});
</script>
</%block>
<%block name="header_extras">
<script type="text/template" id="new-section-template">
<section class="courseware-section branch new-section">
<header>
<a href="#" data-tooltip="Collapse/expand this section" class="expand-collapse-icon collapse"></a>
<div class="item-details">
<h3 class="section-name">
<form class="section-name-form">
<input type="text" value="New Section Name" class="new-section-name" />
<input type="submit" class="new-section-name-save" data-parent="${parent_location}" data-template="${new_section_template}" value="Save" />
<input type="button" class="new-section-name-cancel" value="Cancel" /></h3>
</form>
</div>
</header>
</section>
</script>
<script type="text/template" id="blank-slate-template">
<section class="courseware-section branch new-section">
<header>
<a href="#" data-tooltip="Collapse/expand this section" class="expand-collapse-icon collapse"></a>
<div class="item-details">
<h3 class="section-name">
<span class="section-name-span">Click here to set the section name</span>
<form class="section-name-form">
<input type="text" value="New Section Name" class="new-section-name" />
<input type="submit" class="new-section-name-save" data-parent="${parent_location}" data-template="${new_section_template}" value="Save" />
<input type="button" class="new-section-name-cancel" value="Cancel" /></h3>
</form>
</div>
<div class="item-actions">
<a href="#" data-tooltip="Delete this section" class="delete-button delete-section-button"><span class="delete-icon"></span></a>
<a href="#" data-tooltip="Drag to re-order" class="drag-handle"></a>
</div>
</header>
</section>
</script>
<script type="text/template" id="new-subsection-template">
<li class="branch collapsed">
<div class="section-item editing">
<form class="new-subsection-form">
<span class="folder-icon"></span>
<span class="subsection-name">
<input type="text" value="New Subsection" class="new-subsection-name-input" />
</span>
<input type="submit" value="Save" class="new-subsection-name-save" />
<input type="button" value="Cancel" class="new-subsection-name-cancel" />
</form>
</div>
<ol>
<li>
<a href="unit.html" class="new-unit-item">
<span class="new-unit-icon"></span>New Unit
</a>
</li>
</ol>
</li>
</script>
</%block>
<%block name="content">
<div class="wrapper-mast wrapper">
<header class="mast has-actions has-subtitle">
<h1 class="page-header">
<small class="subtitle">Course Content</small>
<span class="sr">&gt; </span>Course Outline
</h1>
<nav class="nav-actions">
<h3 class="sr">Page Actions</h3>
<ul>
<li class="nav-item">
<a href="#" class="toggle-button toggle-button-sections"><i class="icon-arrow-up"></i> <span class="label">Collapse All Sections</span></a>
</li>
<li class="nav-item">
<a href="#" class="button new-button new-courseware-section-button"><i class="icon-plus"></i> New Section</a>
</li>
<li class="nav-item">
<a href="${lms_link}" rel="external" class="button view-button view-live-button">View Live</a>
</li>
</ul>
</nav>
</header>
</div>
<div class="main-wrapper">
<div class="inner-wrapper">
<article class="courseware-overview" data-course-id="${context_course.location.url()}">
% for section in sections:
<section class="courseware-section branch" data-id="${section.location}">
<header>
<a href="#" data-tooltip="Expand/collapse this section" class="expand-collapse-icon collapse"></a>
<div class="item-details" data-id="${section.location}">
<h3 class="section-name" data-name="${section.display_name_with_default | h}"></h3>
<div class="section-published-date">
<%
if section.lms.start is not None:
start_date_str = section.lms.start.strftime('%m/%d/%Y')
start_time_str = section.lms.start.strftime('%H:%M')
else:
start_date_str = ''
start_time_str = ''
%>
%if section.lms.start is None:
<span class="published-status">This section has not been released.</span>
<a href="#" class="schedule-button" data-date="" data-time="" data-id="${section.location}">Schedule</a>
%else:
<span class="published-status"><strong>Will Release:</strong>
${date_utils.get_default_time_display(section.lms.start)}</span>
<a href="#" class="edit-button" data-date="${start_date_str}"
data-time="${start_time_str}" data-id="${section.location}">Edit</a>
%endif
</div>
</div>
<div class="item-actions">
<a href="#" data-tooltip="Delete this section" class="delete-button delete-section-button"><span class="delete-icon"></span></a>
<a href="#" data-tooltip="Drag to reorder" class="drag-handle"></a>
</div>
</header>
<div class="subsection-list">
<div class="list-header">
<a href="#" class="new-subsection-item" data-template="${new_subsection_template}">
<span class="new-folder-icon"></span>New Subsection
</a>
</div>
<ol data-section-id="${section.location.url()}">
% for subsection in section.get_children():
<li class="branch collapsed id-holder" data-id="${subsection.location}">
<div class="section-item">
<div class="details">
<a href="#" data-tooltip="Expand/collapse this subsection" class="expand-collapse-icon expand"></a>
<a href="${reverse('edit_subsection', args=[subsection.location])}">
<span class="folder-icon"></span>
<span class="subsection-name"><span class="subsection-name-value">${subsection.display_name_with_default}</span></span>
</a>
</div>
<div class="gradable-status" data-initial-status="${subsection.lms.format if subsection.lms.format is not None else 'Not Graded'}">
</div>
<div class="item-actions">
<a href="#" data-tooltip="Delete this subsection" class="delete-button delete-subsection-button"><span class="delete-icon"></span></a>
<a href="#" data-tooltip="Drag to reorder" class="drag-handle"></a>
</div>
</div>
${units.enum_units(subsection)}
</li>
% endfor
</ol>
</div>
</section>
% endfor
</article>
</div>
</div>
<footer></footer>
<div class="edit-subsection-publish-settings">
<div class="settings">
<h3>Section Release Date</h3>
<div class="picker datepair">
<div class="field field-start-date">
<label for="">Release Day</label>
<input class="start-date date" type="text" name="start_date" value="" placeholder="MM/DD/YYYY" class="date" size='15' autocomplete="off"/>
</div>
<div class="field field-start-time">
<label for="">Release Time (<abbr title="Coordinated Universal Time">UTC</abbr>)</label>
<input class="start-time time" type="text" name="start_time" value="" placeholder="HH:MM" class="time" size='10' autocomplete="off"/>
</div>
<div class="description">
<p>On the date set above, this section <strong class="section-name"></strong> will be released to students. Any units marked private will only be visible to admins.</p>
</div>
</div>
<a href="#" class="save-button">Save</a><a href="#" class="cancel-button">Cancel</a>
</div>
</div>
</%block>