MDL-70248 qtype_ddimageortext: Drop zones have UI issue in Editing form

diff --git a/question/type/ddimageortext/amd/build/form.min.js b/question/type/ddimageortext/amd/build/form.min.js
index f963ee6..4606e68 100644 (file)
Binary files a/question/type/ddimageortext/amd/build/form.min.js and b/question/type/ddimageortext/amd/build/form.min.js differ

diff --git a/question/type/ddimageortext/amd/build/form.min.js.map b/question/type/ddimageortext/amd/build/form.min.js.map
index bced8d5..25f4338 100644 (file)
Binary files a/question/type/ddimageortext/amd/build/form.min.js.map and b/question/type/ddimageortext/amd/build/form.min.js.map differ

diff --git a/question/type/ddimageortext/amd/src/form.js b/question/type/ddimageortext/amd/src/form.js
index 1e0c80f..2e5dc96 100644 (file)
--- a/question/type/ddimageortext/amd/src/form.js
+++ b/question/type/ddimageortext/amd/src/form.js
@@ -211,7 +211,7 @@ define(['jquery', 'core/dragdrop'], function($, dragDrop) {
 
             // Resize them to the same size.
             $('.dropzones .droppreview').css('padding', '0');
-            var numGroups = $('select.draggroup').first().find('option').length;
+            var numGroups = $('.draggroup select').first().find('option').length;
             for (var group = 1; group <= numGroups; group++) {
                 dragDropToImageForm.resizeAllDragsAndDropsInGroup(group);
             }
@@ -398,9 +398,8 @@ define(['jquery', 'core/dragdrop'], function($, dragDrop) {
                 top = Math.round(dropPosition.top - backgroundPosition.top);
 
             // Constrain coordinates to be inside the background.
-            // The -10 here matches the +10 in resizeAllDragsAndDropsInGroup().
-            left = Math.max(0, Math.min(left, backgroundImage.width() - drop.width() - 10));
-            top = Math.max(0, Math.min(top, backgroundImage.height() - drop.height() - 10));
+            left = Math.round(Math.max(0, Math.min(left, backgroundImage.outerWidth() - drop.outerWidth())));
+            top = Math.round(Math.max(0, Math.min(top, backgroundImage.outerHeight() - drop.outerHeight())));
 
             // Update the form.
             dragDropToImageForm.form.setFormValue('drops', [dropNo, 'xleft'], left);

diff --git a/question/type/ddimageortext/styles.css b/question/type/ddimageortext/styles.css
index 16c75e8..8334a9d 100644 (file)
--- a/question/type/ddimageortext/styles.css
+++ b/question/type/ddimageortext/styles.css
@@ -99,6 +99,7 @@ form.mform fieldset#id_previewareaheader .dragitems {
 form.mform fieldset#id_previewareaheader .droppreview {
     position: absolute;
     cursor: move;
+    white-space: nowrap;
 }
 
 .que.ddimageortext .dragitems.readonly .drag {