Quiz

The following is an exchange between Jean-Michel and myself about the current state of the drag&drop question type. We would very much like fellow moodlers to a) carry out their own testing of the module as it stands b) contribute their own comments to the discussion. Jean-Michel's comments are in dark-blue.

Joseph

*Install

*In Moodle 1.6, thanks to Gustav's invaluable work, the new question implementation theoretically allows for any new question type to be made available to Moodle simply by dropping a folder into \question\type\. However, the mechanism is not complete yet, and a number of (minor but indispensable) changes have to be made to various Moodle core files in order for a new question type to work. For dragdrop these changes are explained in Jean-Michel's readme.txt file.

J.-M. This is a great limitation in the way question types are now handled:: all question using a javascript lib lwill need to modify core files. I think we should solve this issue now creating a standard way for question to add the javascript code they need (and to add it once even if there are several questions of the same type on the page). I am interested to solve this issue because I plan to code a hotspot (select point interaction) question type this summer and I plan to use javascript.

Documentation

There is a short but sufficient tutorial available in the Moodle Docs wiki here.

Feature Requests

1- Preview

When a new dragdrop question has been created it is possible - as for all questions - to Preview it. However, the draggable objects are NOT draggable, and the question does not work. To see it in action one must put that question into an existing Quiz and Preview the Quiz.

J.-M. This was a mistake in my modified README.txt file : I forgot a core file to modify. The README.txt has been modified to correct this problem

2. Feedback

Feedback as to whether the draggable items have been dropped on their targets is given in 3 ways. (1) When authoring a dragdrop question, the teacher can provide an Overall Feedback (OK) and an Overall Feedback (missed). (2) The Quiz mechanism will also display an automatic feedback message, one of the three following "Correct", "Partially correct" or "Incorrect". (3) When quiz has been submitted, further feedback is displayed in the form of a red border around wrongly placed objects and a green border around correctly placed.

In a Quiz which has adaptative mode switched on, I would much prefer feedback #3 to be available to the student immediately upon clicking the Submit page button, rather than having to wait for the Quiz to be submitted in its entirety. Actually, I would prefer another system, see point 3.

J.-M. I agree

3. The green/red border feedback system is better than no feedback at all. However, I would much prefer a more obvious/standard feedback behavior (in Quiz adaptive mode, where the student can change their answer). When the student has dragged & dropped the draggable objects and cliked the Submit page button, I would like to see the wrongly placed draggable objects to immediately return to their original position (at the bottom of the target background image), ready for a new try.

J.-M. This is the way to go

4. At the moment it is possible to drop draggable objects *anywhere on the screen*. A routine should check for objects to be droppable only either on the background image target OR (better) on a hotspot target. Any object dropped some other place would be automatically returned to its original position.

J.-M. I am not sure the second solution will suit all questions, sometimes you may want the student to be able to drag an object anywhere on the background image.

5. As it stands, the dragdrop question type works with

• a (unique) background image where hotspots can be placed
• a series of (smaller) images which can be dragged and dropped on those hotspots (targets).

This system is OK for a number of activities, such as:

• a) drop an image of a flag on the corresponding country (background image is a map);
• b) match a images of a butterflies and images of their favorite flowers (background image consists of x pictures of flowers);
• c) produce an identikit portrait of a suspect by dropping various items (moustache, glasses, etc.) over a silhouette; etc.

However, there is a frequent activity (esp.) in language learning which consists of naming or labelling objects. The dragdrop tutorial in Moodle Docs shows such an example. However, it is not really ergonomic to have to create and save a background image consisting of ... words. Suppose one wants to modify this image (in order to correct a spelling mistake or to add a new word), the teacher has to start from scratch... It would be much better to use the Text field in each Drag & Drop question... if the program could handle text (<div>s) as drag-drop objects instead of images! This is certainly feasible, cf. the Hot Pototoes JMatch activity.

6. As mentioned by Jean-Michel, at the moment the dragdrop question type does not support export/import. This is of course necessary if this question type is to be actually used in Moodle in the future.

J.-M. Yes I see this as an important issue because currently some import/export formats are worked on (see threads on XML import/export and IMS QTI importer in this forum) and none will support third parties question types because no API to do so have been fixed (see Bug 5083)

Gustav has done a wonderful job transforming all question types to plugins. It's now up to us to bring this idea further by allowing complicated question types (javascript, java, flash, ...) without any core file modification and import/export capabilities (at least XML and IMS QTI) for all questions types.

We should also write a developer guide on how to write a new question type with for instance a complete description of the function of each method in the questiontype.php fille.

Bug report in the drag and drop question type.

In file \question\type\dragdrop\questiontype.php, around line 500        // global feedback

the lines for displaying feedbackok and feedbackmissed have been inverted. To correct this bug, simply invert:

                echo $question->options->feedbackmissed;
and
                echo $question->options->feedbackok;

Joseph

style="visibility: hidden;"

I'm wondering whether this style is necessary as it seems to only have an effect on printing, not on viewing on screen.

1. Were the DD tables correctly created at installation ?
   Check you database, you shoud see 3 tables :
   
   • question_dragdrop
   • question_dragdrop_hotspot
   • question_dragdrop_media
2. Is the javascript library correctly included in the page ?
   For instance suppose you can't drag and drop items during a teacher or student attempt. Use your browser to navigate to the quiz and start an attempt. When the DD question is displayed on the page and not working, display the html page sourcecode in your browser and verify that the line :
   

   <script type="text/javascript" src="http://your_moodle_website_url/question/type/dragdrop/wz_dragdrop.js"></script>

   appear near the end of the page
3. is the javascript code correctly created for the page ?
   Just after the previous line you should see :
   

   <script language="JavaScript">

   (or
   

   <script language="text/javascript">

   in recent drag and drop versions) then some lines of javascript code then

   </script>

<script language="JavaScript">
SET_DHTML(CURSOR_MOVE, RESIZABLE, SCROLL, "background11"+NO_DRAG, "gapimage1_0", "container1_0", "gapimage1_1", "container1_1", "gapimage1_2", "container1_2", "gapimage1_3", "container1_3");
dd.elements.container1_0.formId = 'resp32_12';
dd.elements.container1_0.setResizable(false);
dd.elements.container1_0.background="background11";
dd.elements.gapimage1_0.positioned = 0;
dd.elements.container1_0.mainchild = dd.elements.gapimage1_0;
dd.elements.container1_1.formId = 'resp32_13';
dd.elements.container1_1.setResizable(false);
dd.elements.container1_1.background="background11";
dd.elements.gapimage1_1.positioned = 0;
dd.elements.container1_1.mainchild = dd.elements.gapimage1_1;
dd.elements.container1_2.formId = 'resp32_14';
dd.elements.container1_2.setResizable(false);
dd.elements.container1_2.background="background11";
dd.elements.gapimage1_2.positioned = 0;
dd.elements.container1_2.mainchild = dd.elements.gapimage1_2;
dd.elements.container1_3.formId = 'resp32_15';
dd.elements.container1_3.setResizable(false);
dd.elements.container1_3.background="background11";
dd.elements.gapimage1_3.positioned = 0;
dd.elements.container1_3.mainchild = dd.elements.gapimage1_3;
dd.elements.background11.setZ(0);

 function set_all_form_values()
 {
 var length = containers.length;
 for (var i = 0; i < length; i++) {
 if (containers[i].mainchild.positioned) {
 set_form_values(containers[i].mainchild, false);
 set_form_values(containers[i].mainchild.hotspot, true);
 }
 }
 }

 function setValueById(id, val) {
 var obj = document.getElementById(id);
 obj.value = val;
 }

 //dd.elements.background11.setZ(0);

 // create the list of containers, so we don't need to search through all the elements every time
 //var containers = new Array(4);
 var containers = new Array();

 var j = 0;
 for (var i = 0; i < dd.elements.length; i++)
 {
 if (dd.elements[i].mainchild != null) {
 containers[j] = dd.elements[i];
 if (containers[j].mainchild.hotspot != null) {
 containers[j].mainchild.hotspot.hide();
 }
 containers[j].borderwidth = containers[j].mainchild.is_media ? 2 : 0;
 containers[j].resizeTo(containers[j].mainchild.w + 2*containers[j].borderwidth, containers[j].mainchild.h + 2*containers[j].borderwidth);
 containers[j].moveTo(containers[j].mainchild.x - containers[j].borderwidth, containers[j].mainchild.y - containers[j].borderwidth);
 containers[j].addChild(containers[j].mainchild);
 containers[j].mainchild.setZ(1);
 containers[j].mainchild.show();
 containers[j].setZ(2);
 j++;
 }
 }
 function isDefined(variable)
 {
 return typeof(window[variable]) == 'undefined' ? false : true;
 }
 //bk: to resolve overlib ie problem (causes dragged image to drop prematurely):
 //tip from: http://groups.yahoo.com/group/overlibmws/message/541
 if ((isDefined('OLie4') && OLie4) && (!isDefined('OLopr') || !OLopr)) document.Xonmousemove=null;

 function my_DropFunc()
 {
 if (dd.obj.mainchild != null) {
 var bg = dd.elements[dd.obj.background];
 var fieldvalue = (dd.obj.mainchild.x - bg.x) + ',' + (dd.obj.mainchild.y - bg.y) + ',' + dd.obj.mainchild.w + ',' + dd.obj.mainchild.h;
 //eval(dd.obj.formfieldname + '.value = "' + fieldvalue + '"');
 setValueById(dd.obj.formId, fieldvalue);
 }
 }

</script>