Merge branch 'MDL-59691-master' of https://github.com/lucisgit/moodle

mod/assign/feedback/editpdf/styles.css

@@ -27,7 +27,12 @@
 }
 
 .assignfeedback_editpdf_widget .drawingregion[data-currenttool=select] .drawingcanvas {
-    cursor: pointer;
+    cursor: default;
+}
+
+.assignfeedback_editpdf_widget .drawingregion[data-currenttool=select] .commentdrawable textarea,
+.assignfeedback_editpdf_widget .drawingregion[data-currenttool=select] .commentdrawable svg {
+    cursor: move;
 }
 
 .assignfeedback_editpdf_widget .drawingregion {
@@ -337,7 +342,7 @@ ul.assignfeedback_editpdf_menu {
 }
 
 .assignfeedback_editpdf_widget .commentdrawable {
-    display: inline-block;
+    display: flex;
     z-index: 1;
 }
 

mod/assign/feedback/editpdf/yui/build/moodle-assignfeedback_editpdf-editor/moodle-assignfeedback_editpdf-editor-debug.js

@@ -2592,11 +2592,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
             'height': scrollheight + 'px',
             'overflow': 'hidden'
         });
-        marker.setStyles({
+        marker.setStyle('color', COMMENTCOLOUR[this.colour]);
-            'position': 'absolute',
-            'bottom': 0 - scrollheight + 'px',
-            'color': COMMENTCOLOUR[this.colour]
-        });
         this.attach_events(node, menu);
         if (focus) {
             node.focus();
@@ -2630,35 +2626,37 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
      */
     this.attach_events = function(node, menu) {
         var container = node.ancestor('div'),
-            label = node.ancestor('label');
+            label = node.ancestor('label'),
+            marker = label.next('svg');
 
         // Function to collapse a comment to a marker icon.
         node.collapse = function(delay) {
             node.collapse.delay = Y.later(delay, node, function() {
+                if (editor.collapsecomments) {
                     container.addClass('commentcollapsed');
+                }
             });
         };
 
         // Function to expand a comment.
         node.expand = function() {
+            if (node.getData('dragging') !== true) {
+                if (node.collapse.delay) {
+                    node.collapse.delay.cancel();
+                }
                 container.removeClass('commentcollapsed');
+            }
         };
 
         // Expand comment on mouse over (under certain conditions) or click/tap.
         container.on('mouseenter', function() {
             if (editor.currentedit.tool === 'comment' || editor.currentedit.tool === 'select' || this.editor.get('readonly')) {
                 node.expand();
-                if (node.collapse.delay) {
-                    node.collapse.delay.cancel();
-                }
             }
         }, this);
-        container.on('click', function() {
+        container.on('click|tap', function() {
             node.expand();
             node.focus();
-            if (node.collapse.delay) {
-                node.collapse.delay.cancel();
-            }
         }, this);
 
         // Functions to capture reverse tabbing events.
@@ -2718,9 +2716,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
         // Collapse comment on blur.
         container.on('blur', function() {
             node.active = false;
-            if (editor.collapsecomments) {
             node.collapse(800);
-            }
         }, this);
 
         if (!this.editor.get('readonly')) {
@@ -2758,38 +2754,37 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
             node.on('gesturemovestart', function(e) {
                 if (editor.currentedit.tool === 'select') {
                     e.preventDefault();
-                    node.setData('dragging', true);
+                    if (editor.collapsecomments) {
-                    node.setData('offsetx', e.clientX - node.getX());
+                        node.setData('offsetx', 8);
-                    node.setData('offsety', e.clientY - node.getY());
+                        node.setData('offsety', 8);
+                    } else {
+                        node.setData('offsetx', e.clientX - container.getX());
+                        node.setData('offsety', e.clientY - container.getY());
+                    }
                 }
             });
-            node.on('gesturemoveend', function() {
-                if (editor.currentedit.tool === 'select') {
-                    node.setData('dragging', false);
-                    this.editor.save_current_page();
-                }
-            }, null, this);
             node.on('gesturemove', function(e) {
                 if (editor.currentedit.tool === 'select') {
                     var x = e.clientX - node.getData('offsetx'),
                         y = e.clientY - node.getData('offsety'),
-                        nodewidth,
-                        nodeheight,
                         newlocation,
                         windowlocation,
                         bounds;
 
-                    nodewidth = parseInt(node.getStyle('width'), 10);
+                    if (node.getData('dragging') !== true) {
-                    nodeheight = parseInt(node.getStyle('height'), 10);
+                        // Collapse comment during move.
+                        node.collapse(0);
+                        node.setData('dragging', true);
+                    }
 
                     newlocation = this.editor.get_canvas_coordinates(new M.assignfeedback_editpdf.point(x, y));
                     bounds = this.editor.get_canvas_bounds(true);
                     bounds.x = 0;
                     bounds.y = 0;
 
-                    bounds.width -= nodewidth + 42;
+                    bounds.width -= 24;
-                    bounds.height -= nodeheight + 8;
+                    bounds.height -= 24;
-                    // Clip to the window size - the comment size.
+                    // Clip to the window size - the comment icon size.
                     newlocation.clip(bounds);
 
                     this.x = newlocation.x;
@@ -2801,6 +2796,63 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
                     this.drawable.store_position(container, windowlocation.x, windowlocation.y);
                 }
             }, null, this);
+            node.on('gesturemoveend', function() {
+                if (editor.currentedit.tool === 'select') {
+                    if (node.getData('dragging') === true) {
+                        node.setData('dragging', false);
+                    }
+                    this.editor.save_current_page();
+                }
+            }, null, this);
+            marker.on('gesturemovestart', function(e) {
+                if (editor.currentedit.tool === 'select') {
+                    e.preventDefault();
+                    node.setData('offsetx', e.clientX - container.getX());
+                    node.setData('offsety', e.clientY - container.getY());
+                    node.expand();
+                }
+            });
+            marker.on('gesturemove', function(e) {
+                if (editor.currentedit.tool === 'select') {
+                    var x = e.clientX - node.getData('offsetx'),
+                        y = e.clientY - node.getData('offsety'),
+                        newlocation,
+                        windowlocation,
+                        bounds;
+
+                    if (node.getData('dragging') !== true) {
+                        // Collapse comment during move.
+                        node.collapse(100);
+                        node.setData('dragging', true);
+                    }
+
+                    newlocation = this.editor.get_canvas_coordinates(new M.assignfeedback_editpdf.point(x, y));
+                    bounds = this.editor.get_canvas_bounds(true);
+                    bounds.x = 0;
+                    bounds.y = 0;
+
+                    bounds.width -= 24;
+                    bounds.height -= 24;
+                    // Clip to the window size - the comment icon size.
+                    newlocation.clip(bounds);
+
+                    this.x = newlocation.x;
+                    this.y = newlocation.y;
+
+                    windowlocation = this.editor.get_window_coordinates(newlocation);
+                    container.setX(windowlocation.x);
+                    container.setY(windowlocation.y);
+                    this.drawable.store_position(container, windowlocation.x, windowlocation.y);
+                }
+            }, null, this);
+            marker.on('gesturemoveend', function() {
+                if (editor.currentedit.tool === 'select') {
+                    if (node.getData('dragging') === true) {
+                        node.setData('dragging', false);
+                    }
+                    this.editor.save_current_page();
+                }
+            }, null, this);
 
             this.menu = new M.assignfeedback_editpdf.commentmenu({
                 buttonNode: this.menulink,
@@ -4455,13 +4507,15 @@ EDITOR.prototype = {
      * @method expandCollapseComments
      */
     expandCollapseComments: function() {
+        var comments = Y.all('.commentdrawable');
+
         if (this.collapsecomments) {
             this.collapsecomments = false;
+            comments.removeClass('commentcollapsed');
         } else {
             this.collapsecomments = true;
+            comments.addClass('commentcollapsed');
         }
-
-        this.redraw();
     },
 
     /**

mod/assign/feedback/editpdf/yui/build/moodle-assignfeedback_editpdf-editor/moodle-assignfeedback_editpdf-editor.js

@@ -2592,11 +2592,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
             'height': scrollheight + 'px',
             'overflow': 'hidden'
         });
-        marker.setStyles({
+        marker.setStyle('color', COMMENTCOLOUR[this.colour]);
-            'position': 'absolute',
-            'bottom': 0 - scrollheight + 'px',
-            'color': COMMENTCOLOUR[this.colour]
-        });
         this.attach_events(node, menu);
         if (focus) {
             node.focus();
@@ -2630,35 +2626,37 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
      */
     this.attach_events = function(node, menu) {
         var container = node.ancestor('div'),
-            label = node.ancestor('label');
+            label = node.ancestor('label'),
+            marker = label.next('svg');
 
         // Function to collapse a comment to a marker icon.
         node.collapse = function(delay) {
             node.collapse.delay = Y.later(delay, node, function() {
+                if (editor.collapsecomments) {
                     container.addClass('commentcollapsed');
+                }
             });
         };
 
         // Function to expand a comment.
         node.expand = function() {
+            if (node.getData('dragging') !== true) {
+                if (node.collapse.delay) {
+                    node.collapse.delay.cancel();
+                }
                 container.removeClass('commentcollapsed');
+            }
         };
 
         // Expand comment on mouse over (under certain conditions) or click/tap.
         container.on('mouseenter', function() {
             if (editor.currentedit.tool === 'comment' || editor.currentedit.tool === 'select' || this.editor.get('readonly')) {
                 node.expand();
-                if (node.collapse.delay) {
-                    node.collapse.delay.cancel();
-                }
             }
         }, this);
-        container.on('click', function() {
+        container.on('click|tap', function() {
             node.expand();
             node.focus();
-            if (node.collapse.delay) {
-                node.collapse.delay.cancel();
-            }
         }, this);
 
         // Functions to capture reverse tabbing events.
@@ -2718,9 +2716,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
         // Collapse comment on blur.
         container.on('blur', function() {
             node.active = false;
-            if (editor.collapsecomments) {
             node.collapse(800);
-            }
         }, this);
 
         if (!this.editor.get('readonly')) {
@@ -2758,38 +2754,37 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
             node.on('gesturemovestart', function(e) {
                 if (editor.currentedit.tool === 'select') {
                     e.preventDefault();
-                    node.setData('dragging', true);
+                    if (editor.collapsecomments) {
-                    node.setData('offsetx', e.clientX - node.getX());
+                        node.setData('offsetx', 8);
-                    node.setData('offsety', e.clientY - node.getY());
+                        node.setData('offsety', 8);
+                    } else {
+                        node.setData('offsetx', e.clientX - container.getX());
+                        node.setData('offsety', e.clientY - container.getY());
+                    }
                 }
             });
-            node.on('gesturemoveend', function() {
-                if (editor.currentedit.tool === 'select') {
-                    node.setData('dragging', false);
-                    this.editor.save_current_page();
-                }
-            }, null, this);
             node.on('gesturemove', function(e) {
                 if (editor.currentedit.tool === 'select') {
                     var x = e.clientX - node.getData('offsetx'),
                         y = e.clientY - node.getData('offsety'),
-                        nodewidth,
-                        nodeheight,
                         newlocation,
                         windowlocation,
                         bounds;
 
-                    nodewidth = parseInt(node.getStyle('width'), 10);
+                    if (node.getData('dragging') !== true) {
-                    nodeheight = parseInt(node.getStyle('height'), 10);
+                        // Collapse comment during move.
+                        node.collapse(0);
+                        node.setData('dragging', true);
+                    }
 
                     newlocation = this.editor.get_canvas_coordinates(new M.assignfeedback_editpdf.point(x, y));
                     bounds = this.editor.get_canvas_bounds(true);
                     bounds.x = 0;
                     bounds.y = 0;
 
-                    bounds.width -= nodewidth + 42;
+                    bounds.width -= 24;
-                    bounds.height -= nodeheight + 8;
+                    bounds.height -= 24;
-                    // Clip to the window size - the comment size.
+                    // Clip to the window size - the comment icon size.
                     newlocation.clip(bounds);
 
                     this.x = newlocation.x;
@@ -2801,6 +2796,63 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
                     this.drawable.store_position(container, windowlocation.x, windowlocation.y);
                 }
             }, null, this);
+            node.on('gesturemoveend', function() {
+                if (editor.currentedit.tool === 'select') {
+                    if (node.getData('dragging') === true) {
+                        node.setData('dragging', false);
+                    }
+                    this.editor.save_current_page();
+                }
+            }, null, this);
+            marker.on('gesturemovestart', function(e) {
+                if (editor.currentedit.tool === 'select') {
+                    e.preventDefault();
+                    node.setData('offsetx', e.clientX - container.getX());
+                    node.setData('offsety', e.clientY - container.getY());
+                    node.expand();
+                }
+            });
+            marker.on('gesturemove', function(e) {
+                if (editor.currentedit.tool === 'select') {
+                    var x = e.clientX - node.getData('offsetx'),
+                        y = e.clientY - node.getData('offsety'),
+                        newlocation,
+                        windowlocation,
+                        bounds;
+
+                    if (node.getData('dragging') !== true) {
+                        // Collapse comment during move.
+                        node.collapse(100);
+                        node.setData('dragging', true);
+                    }
+
+                    newlocation = this.editor.get_canvas_coordinates(new M.assignfeedback_editpdf.point(x, y));
+                    bounds = this.editor.get_canvas_bounds(true);
+                    bounds.x = 0;
+                    bounds.y = 0;
+
+                    bounds.width -= 24;
+                    bounds.height -= 24;
+                    // Clip to the window size - the comment icon size.
+                    newlocation.clip(bounds);
+
+                    this.x = newlocation.x;
+                    this.y = newlocation.y;
+
+                    windowlocation = this.editor.get_window_coordinates(newlocation);
+                    container.setX(windowlocation.x);
+                    container.setY(windowlocation.y);
+                    this.drawable.store_position(container, windowlocation.x, windowlocation.y);
+                }
+            }, null, this);
+            marker.on('gesturemoveend', function() {
+                if (editor.currentedit.tool === 'select') {
+                    if (node.getData('dragging') === true) {
+                        node.setData('dragging', false);
+                    }
+                    this.editor.save_current_page();
+                }
+            }, null, this);
 
             this.menu = new M.assignfeedback_editpdf.commentmenu({
                 buttonNode: this.menulink,
@@ -4455,13 +4507,15 @@ EDITOR.prototype = {
      * @method expandCollapseComments
      */
     expandCollapseComments: function() {
+        var comments = Y.all('.commentdrawable');
+
         if (this.collapsecomments) {
             this.collapsecomments = false;
+            comments.removeClass('commentcollapsed');
         } else {
             this.collapsecomments = true;
+            comments.addClass('commentcollapsed');
         }
-
-        this.redraw();
     },
 
     /**

mod/assign/feedback/editpdf/yui/src/editor/js/comment.js

@@ -215,11 +215,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
             'height': scrollheight + 'px',
             'overflow': 'hidden'
         });
-        marker.setStyles({
+        marker.setStyle('color', COMMENTCOLOUR[this.colour]);
-            'position': 'absolute',
-            'bottom': 0 - scrollheight + 'px',
-            'color': COMMENTCOLOUR[this.colour]
-        });
         this.attach_events(node, menu);
         if (focus) {
             node.focus();
@@ -253,35 +249,37 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
      */
     this.attach_events = function(node, menu) {
         var container = node.ancestor('div'),
-            label = node.ancestor('label');
+            label = node.ancestor('label'),
+            marker = label.next('svg');
 
         // Function to collapse a comment to a marker icon.
         node.collapse = function(delay) {
             node.collapse.delay = Y.later(delay, node, function() {
+                if (editor.collapsecomments) {
                     container.addClass('commentcollapsed');
+                }
             });
         };
 
         // Function to expand a comment.
         node.expand = function() {
+            if (node.getData('dragging') !== true) {
+                if (node.collapse.delay) {
+                    node.collapse.delay.cancel();
+                }
                 container.removeClass('commentcollapsed');
+            }
         };
 
         // Expand comment on mouse over (under certain conditions) or click/tap.
         container.on('mouseenter', function() {
             if (editor.currentedit.tool === 'comment' || editor.currentedit.tool === 'select' || this.editor.get('readonly')) {
                 node.expand();
-                if (node.collapse.delay) {
-                    node.collapse.delay.cancel();
-                }
             }
         }, this);
-        container.on('click', function() {
+        container.on('click|tap', function() {
             node.expand();
             node.focus();
-            if (node.collapse.delay) {
-                node.collapse.delay.cancel();
-            }
         }, this);
 
         // Functions to capture reverse tabbing events.
@@ -341,9 +339,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
         // Collapse comment on blur.
         container.on('blur', function() {
             node.active = false;
-            if (editor.collapsecomments) {
             node.collapse(800);
-            }
         }, this);
 
         if (!this.editor.get('readonly')) {
@@ -381,38 +377,37 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
             node.on('gesturemovestart', function(e) {
                 if (editor.currentedit.tool === 'select') {
                     e.preventDefault();
-                    node.setData('dragging', true);
+                    if (editor.collapsecomments) {
-                    node.setData('offsetx', e.clientX - node.getX());
+                        node.setData('offsetx', 8);
-                    node.setData('offsety', e.clientY - node.getY());
+                        node.setData('offsety', 8);
+                    } else {
+                        node.setData('offsetx', e.clientX - container.getX());
+                        node.setData('offsety', e.clientY - container.getY());
+                    }
                 }
             });
-            node.on('gesturemoveend', function() {
-                if (editor.currentedit.tool === 'select') {
-                    node.setData('dragging', false);
-                    this.editor.save_current_page();
-                }
-            }, null, this);
             node.on('gesturemove', function(e) {
                 if (editor.currentedit.tool === 'select') {
                     var x = e.clientX - node.getData('offsetx'),
                         y = e.clientY - node.getData('offsety'),
-                        nodewidth,
-                        nodeheight,
                         newlocation,
                         windowlocation,
                         bounds;
 
-                    nodewidth = parseInt(node.getStyle('width'), 10);
+                    if (node.getData('dragging') !== true) {
-                    nodeheight = parseInt(node.getStyle('height'), 10);
+                        // Collapse comment during move.
+                        node.collapse(0);
+                        node.setData('dragging', true);
+                    }
 
                     newlocation = this.editor.get_canvas_coordinates(new M.assignfeedback_editpdf.point(x, y));
                     bounds = this.editor.get_canvas_bounds(true);
                     bounds.x = 0;
                     bounds.y = 0;
 
-                    bounds.width -= nodewidth + 42;
+                    bounds.width -= 24;
-                    bounds.height -= nodeheight + 8;
+                    bounds.height -= 24;
-                    // Clip to the window size - the comment size.
+                    // Clip to the window size - the comment icon size.
                     newlocation.clip(bounds);
 
                     this.x = newlocation.x;
@@ -424,6 +419,63 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
                     this.drawable.store_position(container, windowlocation.x, windowlocation.y);
                 }
             }, null, this);
+            node.on('gesturemoveend', function() {
+                if (editor.currentedit.tool === 'select') {
+                    if (node.getData('dragging') === true) {
+                        node.setData('dragging', false);
+                    }
+                    this.editor.save_current_page();
+                }
+            }, null, this);
+            marker.on('gesturemovestart', function(e) {
+                if (editor.currentedit.tool === 'select') {
+                    e.preventDefault();
+                    node.setData('offsetx', e.clientX - container.getX());
+                    node.setData('offsety', e.clientY - container.getY());
+                    node.expand();
+                }
+            });
+            marker.on('gesturemove', function(e) {
+                if (editor.currentedit.tool === 'select') {
+                    var x = e.clientX - node.getData('offsetx'),
+                        y = e.clientY - node.getData('offsety'),
+                        newlocation,
+                        windowlocation,
+                        bounds;
+
+                    if (node.getData('dragging') !== true) {
+                        // Collapse comment during move.
+                        node.collapse(100);
+                        node.setData('dragging', true);
+                    }
+
+                    newlocation = this.editor.get_canvas_coordinates(new M.assignfeedback_editpdf.point(x, y));
+                    bounds = this.editor.get_canvas_bounds(true);
+                    bounds.x = 0;
+                    bounds.y = 0;
+
+                    bounds.width -= 24;
+                    bounds.height -= 24;
+                    // Clip to the window size - the comment icon size.
+                    newlocation.clip(bounds);
+
+                    this.x = newlocation.x;
+                    this.y = newlocation.y;
+
+                    windowlocation = this.editor.get_window_coordinates(newlocation);
+                    container.setX(windowlocation.x);
+                    container.setY(windowlocation.y);
+                    this.drawable.store_position(container, windowlocation.x, windowlocation.y);
+                }
+            }, null, this);
+            marker.on('gesturemoveend', function() {
+                if (editor.currentedit.tool === 'select') {
+                    if (node.getData('dragging') === true) {
+                        node.setData('dragging', false);
+                    }
+                    this.editor.save_current_page();
+                }
+            }, null, this);
 
             this.menu = new M.assignfeedback_editpdf.commentmenu({
                 buttonNode: this.menulink,

mod/assign/feedback/editpdf/yui/src/editor/js/editor.js

@@ -1234,13 +1234,15 @@ EDITOR.prototype = {
      * @method expandCollapseComments
      */
     expandCollapseComments: function() {
+        var comments = Y.all('.commentdrawable');
+
         if (this.collapsecomments) {
             this.collapsecomments = false;
+            comments.removeClass('commentcollapsed');
         } else {
             this.collapsecomments = true;
+            comments.addClass('commentcollapsed');
         }
-
-        this.redraw();
     },
 
     /**