Andal.LND/edx-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Drag and drop support on the course outline page.

Browse Source
This commit is contained in:
cahrens
2014-07-22 14:16:45 -04:00
parent e8ae3d1b4a
commit 650bdc2fe7
10 changed files with 168 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
cms/static/js/spec/utils/drag_and_drop_spec.js
View File

@@ -1,10 +1,32 @@
define(["js/utils/drag_and_drop", "js/views/feedback_notification", "js/spec_helpers/create_sinon", "jquery"],
function (ContentDragger, Notification, create_sinon, $) {
define(["js/utils/drag_and_drop", "js/views/feedback_notification", "js/spec_helpers/create_sinon", "jquery", "underscore"],
function (ContentDragger, Notification, create_sinon, $, _) {
describe("Overview drag and drop functionality", function () {
beforeEach(function () {
setFixtures(readFixtures('mock/mock-outline.underscore'));
ContentDragger.makeDraggable('.unit', '.unit-drag-handle', 'ol.sortable-unit-list', 'li.courseware-subsection, article.subsection-body');
ContentDragger.makeDraggable('.courseware-subsection', '.subsection-drag-handle', '.sortable-subsection-list', 'section');
_.each(
$('.unit'),
function (element) {
ContentDragger.makeDraggable(element, {
type: '.unit',
handleClass: '.unit-drag-handle',
droppableClass: 'ol.sortable-unit-list',
parentLocationSelector: 'li.courseware-subsection',
refresh: jasmine.createSpy('Spy on Unit')
});
}
);
_.each(
$('.courseware-subsection'),
function (element) {
ContentDragger.makeDraggable(element, {
type: '.courseware-subsection',
handleClass: '.subsection-drag-handle',
droppableClass: '.sortable-subsection-list',
parentLocationSelector: 'section',
refresh: jasmine.createSpy('Spy on Subsection')
});
}
);
});
describe("findDestination", function () {
@@ -115,7 +137,7 @@ define(["js/utils/drag_and_drop", "js/views/feedback_notification", "js/spec_hel
});
it("can drag into a collapsed list", function () {
var $ele, destination;
$('#subsection-2').addClass('collapsed');
$('#subsection-2').addClass('is-collapsed');
$ele = $('#unit-2');
$ele.offset({
top: $('#subsection-2').offset().top + 3,
@@ -142,11 +164,11 @@ define(["js/utils/drag_and_drop", "js/views/feedback_notification", "js/spec_hel
});
});
it("collapses expanded elements", function () {
expect($('#subsection-1')).not.toHaveClass('collapsed');
expect($('#subsection-1')).not.toHaveClass('is-collapsed');
ContentDragger.onDragStart({
element: $('#subsection-1')
}, null, null);
expect($('#subsection-1')).toHaveClass('collapsed');
expect($('#subsection-1')).toHaveClass('is-collapsed');
expect($('#subsection-1')).toHaveClass('expand-on-drop');
});
});
@@ -246,16 +268,16 @@ define(["js/utils/drag_and_drop", "js/views/feedback_notification", "js/spec_hel
expect(['0px', 'auto']).toContain($('#unit-1').css('left'));
});
it("expands an element if it was collapsed on drag start", function () {
$('#subsection-1').addClass('collapsed');
$('#subsection-1').addClass('is-collapsed');
$('#subsection-1').addClass('expand-on-drop');
ContentDragger.onDragEnd({
element: $('#subsection-1')
}, null, null);
expect($('#subsection-1')).not.toHaveClass('collapsed');
expect($('#subsection-1')).not.toHaveClass('is-collapsed');
expect($('#subsection-1')).not.toHaveClass('expand-on-drop');
});
it("expands a collapsed element when something is dropped in it", function () {
$('#subsection-2').addClass('collapsed');
$('#subsection-2').addClass('is-collapsed');
ContentDragger.dragState.dropDestination = $('#list-2');
ContentDragger.dragState.attachMethod = "prepend";
ContentDragger.dragState.parentList = $('#subsection-2');
@@ -264,7 +286,7 @@ define(["js/utils/drag_and_drop", "js/views/feedback_notification", "js/spec_hel
}, null, {
clientX: $('#unit-1').offset().left
});
expect($('#subsection-2')).not.toHaveClass('collapsed');
expect($('#subsection-2')).not.toHaveClass('is-collapsed');
});
});
describe("AJAX", function () {
@@ -306,6 +328,10 @@ define(["js/utils/drag_and_drop", "js/views/feedback_notification", "js/spec_hel
expect(this.savingSpies.hide).toHaveBeenCalled();
this.clock.tick(1001);
expect($('#unit-1')).not.toHaveClass('was-dropped');
// source
expect($('#subsection-1').data('refresh')).toHaveBeenCalled();
// target
expect($('#subsection-2').data('refresh')).toHaveBeenCalled();
});
});
});