TNL-6929:
Improves navigation within Studio for Learning Sequences, speeding up authors who want to see how a learner progresses through content without needing to jump over to the LMS. This adds a dropdown section navigator to the breadcrumbs on the unit page and copies the sequence navigator from LMS to the studio unit page.
This commit is contained in:
@@ -51,6 +51,28 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
outlineURL: "${outline_url | n, js_escaped_string}"
|
||||
}
|
||||
);
|
||||
require(["js/models/xblock_info", "js/views/xblock", "js/views/utils/xblock_utils", "common/js/components/utils/view_utils"], function (XBlockInfo, XBlockView, XBlockUtils, ViewUtils) {
|
||||
var model = new XBlockInfo({
|
||||
id: '${subsection.location|n, decode.utf8}'
|
||||
});
|
||||
var xblockView = new XBlockView({
|
||||
model: model,
|
||||
el: $('#sequence-nav'),
|
||||
view: 'author_view?position=${position|n, decode.utf8}&next_url=${next_url|n, decode.utf8}&prev_url=${prev_url|n, decode.utf8}'
|
||||
});
|
||||
xblockView.xblockReady = function() {
|
||||
$('.seq_new_button').click(function(evt) {
|
||||
evt.preventDefault();
|
||||
XBlockUtils.addXBlock($(evt.target)).done(function(locator) {
|
||||
ViewUtils.redirect('/container/' + locator + '?action=new');
|
||||
return false;
|
||||
});
|
||||
return false;
|
||||
});
|
||||
|
||||
};
|
||||
xblockView.render();
|
||||
});
|
||||
</%static:webpack>
|
||||
</%block>
|
||||
|
||||
@@ -63,20 +85,34 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
|
||||
<div class="wrapper-mast wrapper">
|
||||
<header class="mast has-actions has-navigation has-subtitle">
|
||||
<div class="page-header">
|
||||
<small class="navigation navigation-parents subtitle">
|
||||
% for ancestor in ancestor_xblocks:
|
||||
<%
|
||||
ancestor_url = xblock_studio_url(ancestor)
|
||||
%>
|
||||
% if ancestor_url:
|
||||
<a href="${ancestor_url}" class="navigation-item navigation-link navigation-parent">${ancestor.display_name_with_default}</a>
|
||||
% else:
|
||||
<span class="navigation-item navigation-parent">${ancestor.display_name_with_default}</span>
|
||||
% endif
|
||||
<div class="jump-nav">
|
||||
<nav class="nav-dd title ui-left">
|
||||
<ol>
|
||||
% for block in ancestor_xblocks:
|
||||
<li class="nav-item">
|
||||
<span class="title label">${block['block'].display_name_with_default}
|
||||
<span class="icon fa fa-caret-down ui-toggle-dd" aria-hidden="true"></span>
|
||||
</span>
|
||||
% if not block['is_last']:
|
||||
<span class="spacer"> ›</span>
|
||||
% endif
|
||||
<div class="wrapper wrapper-nav-sub">
|
||||
<div class="nav-sub">
|
||||
<ul>
|
||||
% for child in block['children']:
|
||||
<li class="nav-item">
|
||||
<a href="${xblock_studio_url(child)}">${child.display_name_with_default}</a>
|
||||
</li>
|
||||
% endfor
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
% endfor
|
||||
</small>
|
||||
<div class="wrapper-xblock-field incontext-editor is-editable"
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="wrapper-xblock-field incontext-editor is-editable"
|
||||
data-field="display_name" data-field-display-name="${_("Display Name")}">
|
||||
<h1 class="page-header-title xblock-field-value incontext-editor-value"><span class="title-value">${xblock.display_name_with_default}</span></h1>
|
||||
</div>
|
||||
@@ -108,6 +144,7 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
% endif
|
||||
</ul>
|
||||
</nav>
|
||||
<div id="sequence-nav"></div>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
@@ -158,12 +195,7 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
<span class="tip"><span class="sr">Tip: </span>${Text(_('To create a link to this unit from an HTML component in this course, enter "/jump_to_id/<location ID>" as the URL value.'))}</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="wrapper-unit-tree-location bar-mod-content">
|
||||
<h5 class="title">${_("Location in Course Outline")}</h5>
|
||||
<div class="wrapper-unit-overview outline outline-simple">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
% endif
|
||||
</aside>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user