Make course_experience a feature

This commit is contained in:
Andy Armstrong
2017-03-06 17:32:52 -05:00
committed by Diana Huang
parent 9ca051c527
commit a3f32fea5a
24 changed files with 169 additions and 107 deletions

View File

@@ -0,0 +1 @@
../../openedx/features/course_experience/static/course_experience

View File

@@ -1,29 +0,0 @@
(function(define) {
'use strict';
define([
'jquery',
'edx-ui-toolkit/js/utils/constants'
],
function($, constants) {
return function(root) {
// In the future this factory could instantiate a Backbone view or React component that handles events
$(root).keydown(function(event) {
var $focusable = $('.outline-item.focusable'),
currentFocusIndex = $.inArray(event.target, $focusable);
switch (event.keyCode) { // eslint-disable-line default-case
case constants.keyCodes.down:
event.preventDefault();
$focusable.eq(Math.min(currentFocusIndex + 1, $focusable.length - 1)).focus();
break;
case constants.keyCodes.up:
event.preventDefault();
$focusable.eq(Math.max(currentFocusIndex - 1, 0)).focus();
break;
}
});
};
}
);
}).call(this, define || RequireJS.define);

View File

@@ -1,124 +0,0 @@
<section class="course-outline" id="main">
<ol class="block-tree" role="tree">
<li aria-expanded="true" class="outline-item focusable" id="block-v1:edX+DemoX+Demo_Course+type@chapter+block@d8a6192ade314473a78242dfeedfbf5b"
role="treeitem" tabindex="0">
<div class="section-name">
<span class="icon fa fa-chevron-down" aria-hidden="true"></span>
<span>Introduction</span>
</div>
<ol class="outline-item focusable" role="group" tabindex="0">
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@edx_introduction"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@edx_introduction">
Demo Course Overview
</a>
</li>
</ol>
</li>
<li aria-expanded="true" class="outline-item focusable" id="block-v1:edX+DemoX+Demo_Course+type@chapter+block@interactive_demonstrations"
role="treeitem" tabindex="0">
<div class="section-name">
<span class="icon fa fa-chevron-down" aria-hidden="true"></span>
<span>Example Week 1: Getting Started</span>
</div>
<ol class="outline-item focusable" role="group" tabindex="0">
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@19a30717eff543078a5d94ae9d6c18a5"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@19a30717eff543078a5d94ae9d6c18a5">
Lesson 1 - Getting Started
</a>
</li>
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@basic_questions"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@basic_questions">
Homework - Question Styles
</a>
</li>
</ol>
</li>
<li aria-expanded="true" class="outline-item focusable" id="block-v1:edX+DemoX+Demo_Course+type@chapter+block@graded_interactions"
role="treeitem" tabindex="0">
<div class="section-name">
<span class="icon fa fa-chevron-down" aria-hidden="true"></span>
<span>Example Week 2: Get Interactive</span>
</div>
<ol class="outline-item focusable" role="group" tabindex="0">
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@simulations"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@simulations">
Lesson 2 - Let's Get Interactive!
</a>
</li>
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@graded_simulations"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@graded_simulations">
Homework - Labs and Demos
</a>
</li>
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@175e76c4951144a29d46211361266e0e"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@175e76c4951144a29d46211361266e0e">
Homework - Essays
</a>
</li>
</ol>
</li>
<li aria-expanded="true" class="outline-item focusable" id="block-v1:edX+DemoX+Demo_Course+type@chapter+block@social_integration"
role="treeitem" tabindex="0">
<div class="section-name">
<span class="icon fa fa-chevron-down" aria-hidden="true"></span>
<span>Example Week 3: Be Social</span>
</div>
<ol class="outline-item focusable" role="group" tabindex="0">
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@48ecb924d7fe4b66a230137626bfa93e"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@48ecb924d7fe4b66a230137626bfa93e">
Lesson 3 - Be Social
</a>
</li>
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@dbe8fc027bcb4fe9afb744d2e8415855"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@dbe8fc027bcb4fe9afb744d2e8415855">
Homework - Find Your Study Buddy
</a>
</li>
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@6ab9c442501d472c8ed200e367b4edfa"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@6ab9c442501d472c8ed200e367b4edfa">
More Ways to Connect
</a>
</li>
</ol>
</li>
<li aria-expanded="true" class="outline-item focusable" id="block-v1:edX+DemoX+Demo_Course+type@chapter+block@1414ffd5143b4b508f739b563ab468b7"
role="treeitem" tabindex="0">
<div class="section-name">
<span class="icon fa fa-chevron-down" aria-hidden="true"></span>
<span>About Exams and Certificates</span>
</div>
<ol class="outline-item focusable" role="group" tabindex="0">
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@workflow"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@workflow">
edX Exams
</a>
</li>
</ol>
</li>
<li aria-expanded="true" class="outline-item focusable" id="block-v1:edX+DemoX+Demo_Course+type@chapter+block@9fca584977d04885bc911ea76a9ef29e"
role="treeitem" tabindex="0">
<div class="section-name">
<span class="icon fa fa-chevron-down" aria-hidden="true"></span>
<span>holding section</span>
</div>
<ol class="outline-item focusable" role="group" tabindex="0">
<li role="treeitem" tabindex="-1" aria-expanded="true">
<a class="outline-item focusable" href="/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@07bc32474380492cb34f76e5f9d9a135"
id="block-v1:edX+DemoX+Demo_Course+type@sequential+block@07bc32474380492cb34f76e5f9d9a135">
New Subsection
</a>
</li>
</ol>
</li>
</ol>
</section>

View File

@@ -1,86 +0,0 @@
define([
'jquery',
'edx-ui-toolkit/js/utils/constants',
'js/courseware/course_outline_factory'
],
function($, constants, CourseOutlineFactory) {
'use strict';
describe('Course outline factory', function() {
describe('keyboard listener', function() {
var triggerKeyListener = function(current, destination, keyCode) {
current.focus();
spyOn(destination, 'focus');
$('.block-tree').trigger($.Event('keydown', {
keyCode: keyCode,
target: current
}));
};
beforeEach(function() {
loadFixtures('js/fixtures/courseware/course_outline.html');
CourseOutlineFactory('.block-tree');
});
describe('when the down arrow is pressed', function() {
it('moves focus from a subsection to the next subsection in the outline', function() {
var current = $('a.focusable:contains("Homework - Labs and Demos")')[0],
destination = $('a.focusable:contains("Homework - Essays")')[0];
triggerKeyListener(current, destination, constants.keyCodes.down);
expect(destination.focus).toHaveBeenCalled();
});
it('moves focus to the section list if at a section boundary', function() {
var current = $('li.focusable:contains("Example Week 3: Be Social")')[0],
destination = $('ol.focusable:contains("Lesson 3 - Be Social")')[0];
triggerKeyListener(current, destination, constants.keyCodes.down);
expect(destination.focus).toHaveBeenCalled();
});
it('moves focus to the next section if on the last subsection', function() {
var current = $('a.focusable:contains("Homework - Essays")')[0],
destination = $('li.focusable:contains("Example Week 3: Be Social")')[0];
triggerKeyListener(current, destination, constants.keyCodes.down);
expect(destination.focus).toHaveBeenCalled();
});
});
describe('when the up arrow is pressed', function() {
it('moves focus from a subsection to the previous subsection in the outline', function() {
var current = $('a.focusable:contains("Homework - Essays")')[0],
destination = $('a.focusable:contains("Homework - Labs and Demos")')[0];
triggerKeyListener(current, destination, constants.keyCodes.up);
expect(destination.focus).toHaveBeenCalled();
});
it('moves focus to the section group if at the first subsection', function() {
var current = $('a.focusable:contains("Lesson 3 - Be Social")')[0],
destination = $('ol.focusable:contains("Lesson 3 - Be Social")')[0];
triggerKeyListener(current, destination, constants.keyCodes.up);
expect(destination.focus).toHaveBeenCalled();
});
it('moves focus last subsection of the previous section if at a section boundary', function() {
var current = $('li.focusable:contains("Example Week 3: Be Social")')[0],
destination = $('a.focusable:contains("Homework - Essays")')[0];
triggerKeyListener(current, destination, constants.keyCodes.up);
expect(destination.focus).toHaveBeenCalled();
});
});
});
});
}
);

View File

@@ -27,6 +27,7 @@ var options = {
// Otherwise Istanbul which is used for coverage tracking will cause tests to not run.
sourceFiles: [
{pattern: 'coffee/src/**/!(*spec).js'},
{pattern: 'course_experience/js/**/!(*spec).js'},
{pattern: 'discussion/js/**/!(*spec).js'},
{pattern: 'js/**/!(*spec|djangojs).js'},
{pattern: 'lms/js/**/!(*spec).js'},

View File

@@ -18,6 +18,7 @@
* done.
*/
modules: getModulesList([
'course_experience/js/course_outline_factory',
'discussion/js/discussion_board_factory',
'discussion/js/discussion_profile_page_factory',
'js/api_admin/catalog_preview_factory',

View File

@@ -679,6 +679,7 @@
});
testFiles = [
'course_experience/js/spec/course_outline_factory_spec.js',
'discussion/js/spec/discussion_board_factory_spec.js',
'discussion/js/spec/discussion_profile_page_factory_spec.js',
'discussion/js/spec/discussion_board_view_spec.js',
@@ -694,7 +695,6 @@
'js/spec/courseware/course_home_events_spec.js',
'js/spec/courseware/link_clicked_events_spec.js',
'js/spec/courseware/updates_visibility_spec.js',
'js/spec/courseware/course_outline_factory_spec.js',
'js/spec/dashboard/donation.js',
'js/spec/dashboard/dropdown_spec.js',
'js/spec/dashboard/track_events_spec.js',