MDL-50999 dock: Stop adding commands to DOM

The commands div should not be added to the DOM. The version shown in the
dock is different to the standard version in the block, and is manually
added to the dock panel when it is displayed.

The docked version contains additional actions (e.g. the undock button).

The original version of the dock should ideally remain untouched.

Note: A duplicate delegation was discovered when fixing this issue. This
was previosuly not triggered because the watched Node was removed
before the delegation took effect.

lib/yui/build/moodle-core-dock/moodle-core-dock-debug.js

@@ -428,7 +428,6 @@ DOCK.prototype = {
         Y.delegate('mouseenter', this.handleEvent, this.get('dockNode'), '.'+CSS.dockedtitle, this, mouseenterargs);
         this.get('dockNode').on('mouseleave', this.handleEvent, this, {cssselector:'#dock', delay:0.5, iscontained:false});
 
-        Y.delegate('click', this.handleReturnToBlock, this.get('dockNode'), SELECTOR.panelmoveto, this);
         Y.delegate('click', this.handleReturnToBlock, this.get('dockNode'), SELECTOR.panelmoveto, this);
         Y.delegate('dock:actionkey', this.handleDockedItemEvent, this.get('dockNode'), '.'+CSS.dockeditem, this);
 
@@ -1693,8 +1692,7 @@ BLOCK.prototype = {
      * @method initializer
      */
     initializer : function() {
-        var node = Y.one('#inst'+this.get('id')),
+        var node = Y.one('#inst'+this.get('id'));
-            commands;
         if (!node) {
             return false;
         }
@@ -1706,14 +1704,7 @@ BLOCK.prototype = {
         // Move the block straight to the dock if required
         if (node.hasClass(CSS.dockonload)) {
             node.removeClass(CSS.dockonload);
-            commands = node.one('.header .title .commands');
+            this.moveToDock();
-            if (!commands) {
-                commands = Y.Node.create('<div class="commands"></div>');
-                if (node.one('.header .title')) {
-                    node.one('.header .title').append(commands);
-                }
-            }
-            this.moveToDock(null, commands);
         }
         this.skipsetposition = false;
         return true;
@@ -1769,8 +1760,15 @@ BLOCK.prototype = {
         this.recordBlockState();
 
         blocktitle = this.cachedcontentnode.one('.title h2').cloneNode(true);
-        blockcommands = this.cachedcontentnode.one('.title .commands').cloneNode(true);
 
+        // Build up the block commands.
+        // These should not actually added to the DOM.
+        blockcommands = this.cachedcontentnode.one('.title .commands');
+        if (blockcommands) {
+            blockcommands = blockcommands.cloneNode(true);
+        } else {
+            blockcommands = Y.Node.create('<div class="commands"></div>');
+        }
         movetoimg = Y.Node.create('<img />').setAttrs({
             alt : Y.Escape.html(M.util.get_string('undockitem', 'block')),
             title : Y.Escape.html(M.util.get_string('undockblock', 'block', blocktitle.get('innerHTML'))),
@@ -1821,9 +1819,6 @@ BLOCK.prototype = {
         node.replace(this.contentplaceholder);
         dock.addToHoldingArea(node);
         node = null;
-        if (!this.cachedcontentnode.one('.title .commands')) {
-            this.cachedcontentnode.one('.title').append(Y.Node.create('<div class="commands"></div>'));
-        }
     },
 
     /**
@@ -1832,8 +1827,7 @@ BLOCK.prototype = {
      * @return {Boolean}
      */
     returnToPage : function() {
-        var id = this.get('id'),
+        var id = this.get('id');
-            commands;
 
         Y.log('Moving block out of the dock:'+this.get('id'), 'debug', LOGNS);
 
@@ -1849,15 +1843,8 @@ BLOCK.prototype = {
         }
 
         this.contentplaceholder.replace(this.cachedcontentnode);
-        this.cachedcontentnode = Y.one('#'+this.cachedcontentnode.get('id'));
-
-        commands = this.dockitem.get('commands');
-        if (commands) {
-            commands.all('.hidepanelicon').remove();
-            commands.all('.moveto').remove();
-            commands.remove();
-        }
         this.cachedcontentnode = null;
+
         M.util.set_user_preference('docked_block_instance_'+id, 0);
         this.set('isDocked', false);
         return true;

lib/yui/build/moodle-core-dock/moodle-core-dock.js

@@ -426,7 +426,6 @@ DOCK.prototype = {
         Y.delegate('mouseenter', this.handleEvent, this.get('dockNode'), '.'+CSS.dockedtitle, this, mouseenterargs);
         this.get('dockNode').on('mouseleave', this.handleEvent, this, {cssselector:'#dock', delay:0.5, iscontained:false});
 
-        Y.delegate('click', this.handleReturnToBlock, this.get('dockNode'), SELECTOR.panelmoveto, this);
         Y.delegate('click', this.handleReturnToBlock, this.get('dockNode'), SELECTOR.panelmoveto, this);
         Y.delegate('dock:actionkey', this.handleDockedItemEvent, this.get('dockNode'), '.'+CSS.dockeditem, this);
 
@@ -1678,8 +1677,7 @@ BLOCK.prototype = {
      * @method initializer
      */
     initializer : function() {
-        var node = Y.one('#inst'+this.get('id')),
+        var node = Y.one('#inst'+this.get('id'));
-            commands;
         if (!node) {
             return false;
         }
@@ -1690,14 +1688,7 @@ BLOCK.prototype = {
         // Move the block straight to the dock if required
         if (node.hasClass(CSS.dockonload)) {
             node.removeClass(CSS.dockonload);
-            commands = node.one('.header .title .commands');
+            this.moveToDock();
-            if (!commands) {
-                commands = Y.Node.create('<div class="commands"></div>');
-                if (node.one('.header .title')) {
-                    node.one('.header .title').append(commands);
-                }
-            }
-            this.moveToDock(null, commands);
         }
         this.skipsetposition = false;
         return true;
@@ -1752,8 +1743,15 @@ BLOCK.prototype = {
         this.recordBlockState();
 
         blocktitle = this.cachedcontentnode.one('.title h2').cloneNode(true);
-        blockcommands = this.cachedcontentnode.one('.title .commands').cloneNode(true);
 
+        // Build up the block commands.
+        // These should not actually added to the DOM.
+        blockcommands = this.cachedcontentnode.one('.title .commands');
+        if (blockcommands) {
+            blockcommands = blockcommands.cloneNode(true);
+        } else {
+            blockcommands = Y.Node.create('<div class="commands"></div>');
+        }
         movetoimg = Y.Node.create('<img />').setAttrs({
             alt : Y.Escape.html(M.util.get_string('undockitem', 'block')),
             title : Y.Escape.html(M.util.get_string('undockblock', 'block', blocktitle.get('innerHTML'))),
@@ -1804,9 +1802,6 @@ BLOCK.prototype = {
         node.replace(this.contentplaceholder);
         dock.addToHoldingArea(node);
         node = null;
-        if (!this.cachedcontentnode.one('.title .commands')) {
-            this.cachedcontentnode.one('.title').append(Y.Node.create('<div class="commands"></div>'));
-        }
     },
 
     /**
@@ -1815,8 +1810,7 @@ BLOCK.prototype = {
      * @return {Boolean}
      */
     returnToPage : function() {
-        var id = this.get('id'),
+        var id = this.get('id');
-            commands;
 
 
         // Enable the skip anchor when going back to block mode
@@ -1831,15 +1825,8 @@ BLOCK.prototype = {
         }
 
         this.contentplaceholder.replace(this.cachedcontentnode);
-        this.cachedcontentnode = Y.one('#'+this.cachedcontentnode.get('id'));
-
-        commands = this.dockitem.get('commands');
-        if (commands) {
-            commands.all('.hidepanelicon').remove();
-            commands.all('.moveto').remove();
-            commands.remove();
-        }
         this.cachedcontentnode = null;
+
         M.util.set_user_preference('docked_block_instance_'+id, 0);
         this.set('isDocked', false);
         return true;

lib/yui/src/dock/js/block.js

@@ -58,8 +58,7 @@ BLOCK.prototype = {
      * @method initializer
      */
     initializer : function() {
-        var node = Y.one('#inst'+this.get('id')),
+        var node = Y.one('#inst'+this.get('id'));
-            commands;
         if (!node) {
             return false;
         }
@@ -71,14 +70,7 @@ BLOCK.prototype = {
         // Move the block straight to the dock if required
         if (node.hasClass(CSS.dockonload)) {
             node.removeClass(CSS.dockonload);
-            commands = node.one('.header .title .commands');
+            this.moveToDock();
-            if (!commands) {
-                commands = Y.Node.create('<div class="commands"></div>');
-                if (node.one('.header .title')) {
-                    node.one('.header .title').append(commands);
-                }
-            }
-            this.moveToDock(null, commands);
         }
         this.skipsetposition = false;
         return true;
@@ -134,8 +126,15 @@ BLOCK.prototype = {
         this.recordBlockState();
 
         blocktitle = this.cachedcontentnode.one('.title h2').cloneNode(true);
-        blockcommands = this.cachedcontentnode.one('.title .commands').cloneNode(true);
 
+        // Build up the block commands.
+        // These should not actually added to the DOM.
+        blockcommands = this.cachedcontentnode.one('.title .commands');
+        if (blockcommands) {
+            blockcommands = blockcommands.cloneNode(true);
+        } else {
+            blockcommands = Y.Node.create('<div class="commands"></div>');
+        }
         movetoimg = Y.Node.create('<img />').setAttrs({
             alt : Y.Escape.html(M.util.get_string('undockitem', 'block')),
             title : Y.Escape.html(M.util.get_string('undockblock', 'block', blocktitle.get('innerHTML'))),
@@ -186,9 +185,6 @@ BLOCK.prototype = {
         node.replace(this.contentplaceholder);
         dock.addToHoldingArea(node);
         node = null;
-        if (!this.cachedcontentnode.one('.title .commands')) {
-            this.cachedcontentnode.one('.title').append(Y.Node.create('<div class="commands"></div>'));
-        }
     },
 
     /**
@@ -197,8 +193,7 @@ BLOCK.prototype = {
      * @return {Boolean}
      */
     returnToPage : function() {
-        var id = this.get('id'),
+        var id = this.get('id');
-            commands;
 
         Y.log('Moving block out of the dock:'+this.get('id'), 'debug', LOGNS);
 
@@ -214,15 +209,8 @@ BLOCK.prototype = {
         }
 
         this.contentplaceholder.replace(this.cachedcontentnode);
-        this.cachedcontentnode = Y.one('#'+this.cachedcontentnode.get('id'));
-
-        commands = this.dockitem.get('commands');
-        if (commands) {
-            commands.all('.hidepanelicon').remove();
-            commands.all('.moveto').remove();
-            commands.remove();
-        }
         this.cachedcontentnode = null;
+
         M.util.set_user_preference('docked_block_instance_'+id, 0);
         this.set('isDocked', false);
         return true;

lib/yui/src/dock/js/dock.js

@@ -426,7 +426,6 @@ DOCK.prototype = {
         Y.delegate('mouseenter', this.handleEvent, this.get('dockNode'), '.'+CSS.dockedtitle, this, mouseenterargs);
         this.get('dockNode').on('mouseleave', this.handleEvent, this, {cssselector:'#dock', delay:0.5, iscontained:false});
 
-        Y.delegate('click', this.handleReturnToBlock, this.get('dockNode'), SELECTOR.panelmoveto, this);
         Y.delegate('click', this.handleReturnToBlock, this.get('dockNode'), SELECTOR.panelmoveto, this);
         Y.delegate('dock:actionkey', this.handleDockedItemEvent, this.get('dockNode'), '.'+CSS.dockeditem, this);