MDL-43999 Atto : Make image dialogue open on double click of an image.

lib/editor/atto/plugins/image/styles.css

@@ -1,4 +1,9 @@
 .atto_image_preview {
     max-width: 150px;
     max-height: 150px;
+    margin-bottom: 1em;
+}
+
+.editor_atto_content img {
+    cursor: pointer;
 }

lib/editor/atto/plugins/image/yui/build/moodle-atto_image-button/moodle-atto_image-button-debug.js

@@ -192,6 +192,22 @@ Y.namespace('M.atto_image').Button = Y.Base.create('button', Y.M.editor_atto.Edi
             tags: 'img',
             tagMatchRequiresAll: false
         });
+        this.editor.delegate('dblclick', this._handleDoubleClick, 'img', this);
+    },
+
+    /**
+     * Handle a double click on an image.
+     *
+     * @method _handleDoubleClick
+     * @param {EventFacade} e
+     * @private
+     */
+    _handleDoubleClick: function(e) {
+        var image = e.target;
+
+        var selection = this.get('host').getSelectionFromNode(image);
+        this.get('host').setSelection(selection);
+        this._displayDialogue();
     },
 
     /**

lib/editor/atto/plugins/image/yui/build/moodle-atto_image-button/moodle-atto_image-button.js

@@ -192,6 +192,22 @@ Y.namespace('M.atto_image').Button = Y.Base.create('button', Y.M.editor_atto.Edi
             tags: 'img',
             tagMatchRequiresAll: false
         });
+        this.editor.delegate('dblclick', this._handleDoubleClick, 'img', this);
+    },
+
+    /**
+     * Handle a double click on an image.
+     *
+     * @method _handleDoubleClick
+     * @param {EventFacade} e
+     * @private
+     */
+    _handleDoubleClick: function(e) {
+        var image = e.target;
+
+        var selection = this.get('host').getSelectionFromNode(image);
+        this.get('host').setSelection(selection);
+        this._displayDialogue();
     },
 
     /**

lib/editor/atto/plugins/image/yui/src/button/js/button.js

@@ -190,6 +190,22 @@ Y.namespace('M.atto_image').Button = Y.Base.create('button', Y.M.editor_atto.Edi
             tags: 'img',
             tagMatchRequiresAll: false
         });
+        this.editor.delegate('dblclick', this._handleDoubleClick, 'img', this);
+    },
+
+    /**
+     * Handle a double click on an image.
+     *
+     * @method _handleDoubleClick
+     * @param {EventFacade} e
+     * @private
+     */
+    _handleDoubleClick: function(e) {
+        var image = e.target;
+
+        var selection = this.get('host').getSelectionFromNode(image);
+        this.get('host').setSelection(selection);
+        this._displayDialogue();
     },
 
     /**