MDL-55200 question type ddmarker: Display coordinates on image

To make the creation of dropzones easier, the mouse coordinates are shown.

diff --git a/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-debug.js b/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-debug.js
index 13d6512..4d60ffa 100644 (file)
Binary files a/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-debug.js and b/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-debug.js differ

diff --git a/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-min.js b/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-min.js
index 8247169..41fc7ca 100644 (file)
Binary files a/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-min.js and b/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form-min.js differ

diff --git a/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form.js b/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form.js
index 13d6512..4d60ffa 100644 (file)
Binary files a/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form.js and b/question/type/ddmarker/yui/build/moodle-qtype_ddmarker-form/moodle-qtype_ddmarker-form.js differ

diff --git a/question/type/ddmarker/yui/src/form/js/form.js b/question/type/ddmarker/yui/src/form/js/form.js
index 339da2f..04897cb 100644 (file)
--- a/question/type/ddmarker/yui/src/form/js/form.js
+++ b/question/type/ddmarker/yui/src/form/js/form.js
@@ -30,10 +30,14 @@ Y.extend(DDMARKER_FORM, M.qtype_ddmarker.dd_base_class, {
         var tn = Y.one(this.get('topnode'));
         tn.one('div.fcontainer').append(
                 '<div class="ddarea">' +
-                    '<div class="markertexts"></div>' +
-                    '<div class="droparea"></div>' +
-                    '<div class="dropzones"></div>' +
-                    '<div class="grid"></div>' +
+                '<div class="markertexts"></div>' +
+                '<div class="droparea"></div>' +
+                '<div class="dropzones"></div>' +
+                '<ul class="pager">' +
+                '<li><span id="xcoordpreview">X = </span></li>' +
+                '<li><span id="ycoordpreview">Y = </span></li>' +
+                '</ul>' +
+                '<div class="grid"></div>' +
                 '</div>');
         this.doc = this.doc_structure(this);
         this.stop_selector_events();
@@ -42,6 +46,15 @@ Y.extend(DDMARKER_FORM, M.qtype_ddmarker.dd_base_class, {
         Y.later(500, this, this.update_drop_zones, [pendingid], true);
         Y.after(this.load_bg_image, M.form_filepicker, 'callback', this);
         this.load_bg_image();
+
+        var topnode = Y.one(this.get('topnode'));
+        topnode.one('.grid').on('mousemove', function (e) {
+            var img = topnode.one('.dropbackground');
+            var x = Math.round(Number(e.pageX) - img.getX() - 1);
+            var y = Math.round(Number(e.pageY) - img.getY() - 1);
+            topnode.one('#xcoordpreview').setHTML("X = " + x);
+            topnode.one('#ycoordpreview').setHTML("Y = " + y);
+        });
     },
 
     load_bg_image : function() {
@@ -116,7 +129,7 @@ Y.extend(DDMARKER_FORM, M.qtype_ddmarker.dd_base_class, {
         }
     },
     set_options_for_drag_item_selectors : function () {
-        var dragitemsoptions = {'0': ''};
+        var dragitemsoptions = {0: ''};
         for (var i = 1; i <= this.form.get_form_value('noitems', []); i++) {
             var label = this.get_marker_text(i);
             if (label !== "") {