Commit b7e1a0d5 by Brian Jacobel Committed by Diana Huang

Add new info to the course outline

parent 83dd33a0
...@@ -35,23 +35,34 @@ ...@@ -35,23 +35,34 @@
list-style-type: none; list-style-type: none;
a.outline-item { a.outline-item {
display: block; display: flex;
justify-content: space-between;
padding: ($baseline / 2); padding: ($baseline / 2);
&:hover { &:hover {
background-color: palette(primary, x-back); background-color: palette(primary, x-back);
text-decoration: none;
}
} }
&.current { .subsection-text {
border: 1px solid $lms-active-color; .details {
font-size: $body-font-size;
color: $lms-gray;
font-style: italic;
}
}
.subsection-actions {
.resume-right { .resume-right {
@include float(right); position: relative;
top: calc(50% - (#{$baseline} / 2));
} }
} }
} }
&.current {
border: 1px solid $lms-active-color;
}
}
} }
} }
} }
......
...@@ -27,7 +27,6 @@ from django.utils.translation import ugettext as _ ...@@ -27,7 +27,6 @@ from django.utils.translation import ugettext as _
</div> </div>
<ol class="outline-item focusable" role="group" tabindex="0"> <ol class="outline-item focusable" role="group" tabindex="0">
% for subsection in section.get('children') or []: % for subsection in section.get('children') or []:
${ subsection.get('special_exam', '') }
<li <li
class="subsection ${ 'current' if subsection['current'] else '' }" class="subsection ${ 'current' if subsection['current'] else '' }"
role="treeitem" role="treeitem"
...@@ -39,14 +38,80 @@ from django.utils.translation import ugettext as _ ...@@ -39,14 +38,80 @@ from django.utils.translation import ugettext as _
href="${ subsection['lms_web_url'] }" href="${ subsection['lms_web_url'] }"
id="${ subsection['id'] }" id="${ subsection['id'] }"
> >
<div class="subsection-text">
## Subsection title
<span>${ subsection['display_name'] }</span> <span>${ subsection['display_name'] }</span>
<span class="sr-only">${ _("This is your last visited course section.") }</span>
<div class="details">
## There are behavior differences between rendering of subsections which have
## special_exam/timed examinations and those that do not.
##
## Proctoring exposes a exam status message field as well as a status icon
<%
if subsection.get('due') is None:
data_string = subsection['format']
else:
if 'special_exam' in subsection:
data_string = _('due {date}')
else:
data_string = _("{subsection_format} due {{date}}").format(subsection_format=subsection['format'])
%>
% if subsection['format'] or due_date or 'special_exam' in subsection:
<span class="subtitle">
% if 'special_exam' in subsection:
## Display the proctored exam status icon and status message
<span
class="menu-icon icon fa ${subsection['special_exam'].get('suggested_icon', 'fa-pencil-square-o')} ${subsection['special_exam'].get('status', 'eligible')}"
aria-hidden="true"
></span>
<span class="subtitle-name">
${subsection['special_exam'].get('short_description', '')}
</span>
## completed proctored exam statuses should not show the due date
## since the exam has already been submitted by the user
% if not subsection['special_exam'].get('in_completed_state', False):
<span
class="localized-datetime subtitle-name"
data-datetime="${subsection['due']}"
data-string="${data_string}"
data-timezone="${user_timezone}"
data-language="${user_language}"
></span>
% endif
% else:
## non-proctored section, we just show the exam format and the due date
## this is the standard case in edx-platform
<span
class="localized-datetime subtitle-name"
data-datetime="${subsection['due']}"
data-string="${data_string}"
data-timezone="${user_timezone}"
data-language="${user_language}"
></span>
% if 'graded' in subsection and subsection['graded']:
<span
class="menu-icon icon fa fa-pencil-square-o"
aria-hidden="true"
></span>
<span class="sr">${_("This content is graded")}</span>
% endif
% endif
</span>
% endif
</div> <!-- /details -->
</div> <!-- /subsection-text -->
<div class="subsection-actions">
## Resume button (if last visited section)
% if subsection['current']: % if subsection['current']:
<span class="sr-only">${ _("This is your last visited course section.") }</span>
<span class="resume-right"> <span class="resume-right">
<b>${ _("Resume Course") }</b> <b>${ _("Resume Course") }</b>
<span class="icon fa fa-arrow-circle-right" aria-hidden="true"></span> <span class="icon fa fa-arrow-circle-right" aria-hidden="true"></span>
</span> </span>
% endif %endif
</div>
</a> </a>
</li> </li>
% endfor % endfor
......
...@@ -29,6 +29,13 @@ class CourseOutlineFragmentView(EdxFragmentView): ...@@ -29,6 +29,13 @@ class CourseOutlineFragmentView(EdxFragmentView):
for i in range(len(children)): for i in range(len(children)):
child_id = block['children'][i] child_id = block['children'][i]
child_detail = self.populate_children(all_blocks[child_id], all_blocks, course_position) child_detail = self.populate_children(all_blocks[child_id], all_blocks, course_position)
# Fake data; remove
child_detail = dict(child_detail, **{
"format": "",
"due": ""
})
block['children'][i] = child_detail block['children'][i] = child_detail
block['children'][i]['current'] = course_position == child_detail['block_id'] block['children'][i]['current'] = course_position == child_detail['block_id']
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment