Permalink
Browse files

MDL-34328: course dragdrop - performance rewrite

Use YUI's DragDrop delegates for course dragdrop, rather than initialising a Drag object for each individual section and each individual activity/resource.  Also, clone a single drag handle for activities/resources, rather than repeatedly creating a whole new one with the same parameters for each activity/resource.
  • Loading branch information...
1 parent c366bea commit 99cd723af5117e4388b5519da1aca1ad17327ba4 @pauln pauln committed with andrewnicols Aug 24, 2012
Showing with 49 additions and 38 deletions.
  1. +49 −38 course/yui/dragdrop/dragdrop.js
View
87 course/yui/dragdrop/dragdrop.js
@@ -41,6 +41,26 @@ YUI.add('moodle-course-dragdrop', function(Y) {
if (this.sectionlistselector) {
this.sectionlistselector = '.'+CSS.COURSECONTENT+' '+this.sectionlistselector;
this.setup_for_section(this.sectionlistselector);
+
+ // Make each li element in the lists of sections draggable
+ var nodeselector = this.sectionlistselector.slice(CSS.COURSECONTENT.length+2);
+ var del = new Y.DD.Delegate({
+ container: '.'+CSS.COURSECONTENT,
+ nodes: nodeselector,
+ target: true,
+ handles: ['.'+CSS.LEFT],
+ dragConfig: {groups: this.groups}
+ });
+ del.dd.plug(Y.Plugin.DDProxy, {
+ // Don't move the node at the end of the drag
+ moveOnEnd: false
+ });
+ del.dd.plug(Y.Plugin.DDConstrained, {
+ // Keep it inside the .course-content
+ constrain: '#'+CSS.PAGECONTENT,
+ stickY: true
+ });
+ del.dd.plug(Y.Plugin.DDWinScroll);
}
},
@@ -76,22 +96,6 @@ YUI.add('moodle-course-dragdrop', function(Y) {
if (movedown) {
movedown.remove();
}
-
- // Make each li element in the lists of sections draggable
- var dd = new Y.DD.Drag({
- node: sectionnode,
- // Make each li a Drop target too
- groups: this.groups,
- target: true,
- handles: ['.'+CSS.LEFT]
- }).plug(Y.Plugin.DDProxy, {
- // Don't move the node at the end of the drag
- moveOnEnd: false
- }).plug(Y.Plugin.DDConstrained, {
- // Keep it inside the .course-content
- constrain: '#'+CSS.PAGECONTENT,
- stickY: true
- }).plug(Y.Plugin.DDWinScroll);
}
}
}, this);
@@ -244,12 +248,33 @@ YUI.add('moodle-course-dragdrop', function(Y) {
this.groups = ['resource'];
this.samenodeclass = CSS.ACTIVITY;
this.parentnodeclass = CSS.SECTION;
+ this.resourcedraghandle = this.get_drag_handle(M.str.moodle.move, CSS.EDITINGMOVE, CSS.ICONCLASS);
// Go through all sections
var sectionlistselector = M.course.format.get_section_selector(Y);
if (sectionlistselector) {
sectionlistselector = '.'+CSS.COURSECONTENT+' '+sectionlistselector;
this.setup_for_section(sectionlistselector);
+
+ // Initialise drag & drop for all resources/activities
+ var nodeselector = sectionlistselector.slice(CSS.COURSECONTENT.length+2)+' li.'+CSS.ACTIVITY;
+ var del = new Y.DD.Delegate({
+ container: '.'+CSS.COURSECONTENT,
+ nodes: nodeselector,
+ target: true,
+ handles: ['.' + CSS.EDITINGMOVE],
+ dragConfig: {groups: this.groups}
+ });
+ del.dd.plug(Y.Plugin.DDProxy, {
+ // Don't move the node at the end of the drag
+ moveOnEnd: false
+ });
+ del.dd.plug(Y.Plugin.DDConstrained, {
+ // Keep it inside the .course-content
+ constrain: '#'+CSS.PAGECONTENT
+ });
+ del.dd.plug(Y.Plugin.DDWinScroll);
+
M.course.coursebase.register_module(this);
M.course.dragres = this;
}
@@ -269,15 +294,15 @@ YUI.add('moodle-course-dragdrop', function(Y) {
var resources = Y.Node.create('<ul></ul>');
resources.addClass(CSS.SECTION);
sectionnode.one('.'+CSS.CONTENT+' div.'+CSS.SUMMARY).insert(resources, 'after');
+ // Define empty ul as droptarget, so that item could be moved to empty list
+ var tar = new Y.DD.Drop({
+ node: resources,
+ groups: this.groups,
+ padding: '20 0 20 0'
+ });
}
- // Define each ul as droptarget, so that item could be moved to empty list
- var tar = new Y.DD.Drop({
- node: resources,
- groups: this.groups,
- padding: '20 0 20 0'
- });
- // Go through each li element and make them draggable
+ // Initialise each resource/activity in this section
this.setup_for_resource('#'+sectionnode.get('id')+' li.'+CSS.ACTIVITY);
}, this);
},
@@ -292,21 +317,7 @@ YUI.add('moodle-course-dragdrop', function(Y) {
// Replace move icons
var move = resourcesnode.one('a.'+CSS.EDITINGMOVE);
if (move) {
- move.replace(this.get_drag_handle(M.str.moodle.move, CSS.EDITINGMOVE, CSS.ICONCLASS));
- // Make each li element in the lists of sections draggable
- var dd = new Y.DD.Drag({
- node: resourcesnode,
- groups: this.groups,
- // Make each li a Drop target too
- target: true,
- handles: ['.' + CSS.EDITINGMOVE]
- }).plug(Y.Plugin.DDProxy, {
- // Don't move the node at the end of the drag
- moveOnEnd: false
- }).plug(Y.Plugin.DDConstrained, {
- // Keep it inside the .course-content
- constrain: '#'+CSS.PAGECONTENT
- }).plug(Y.Plugin.DDWinScroll);
+ move.replace(this.resourcedraghandle.cloneNode(true));
}
}, this);
},

0 comments on commit 99cd723

Please sign in to comment.