diff --git a/question/type/ddimageortext/amd/build/question.min.js b/question/type/ddimageortext/amd/build/question.min.js index 0be6fecc9ca..0b47757852d 100644 --- a/question/type/ddimageortext/amd/build/question.min.js +++ b/question/type/ddimageortext/amd/build/question.min.js @@ -5,6 +5,6 @@ * @copyright 2018 The Open University * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later */ -define("qtype_ddimageortext/question",["jquery","core/dragdrop","core/key_codes","core_form/changechecker","core_filters/events"],(function($,dragDrop,keys,FormChangeChecker,filterEvent){function DragDropOntoImageQuestion(containerId,readOnly,places){this.containerId=containerId,this.questionAnswer={},this.questionDragDropWidthHeight=[],M.util.js_pending("qtype_ddimageortext-init-"+this.containerId),this.places=places,this.allImagesLoaded=!1,this.imageLoadingTimeoutId=null,this.isPrinting=!1,readOnly&&this.getRoot().addClass("qtype_ddimageortext-readonly");var thisQ=this;this.getNotYetLoadedImages().one("load",(function(){thisQ.waitForAllImagesToBeLoaded()})),this.waitForAllImagesToBeLoaded()}DragDropOntoImageQuestion.prototype.changeAllDragsAndDropsToFilteredContent=function(filteredElement){let currentFilteredItem=$(filteredElement);const parentIsDD=currentFilteredItem.parent().closest("div").hasClass("placed")||currentFilteredItem.parent().hasClass("draghome"),isDD=currentFilteredItem.hasClass("placed")||currentFilteredItem.hasClass("draghome");if(!parentIsDD&&!isDD)return;if(parentIsDD&&(currentFilteredItem=currentFilteredItem.parent().closest("div")),this.getRoot().find(currentFilteredItem).length<=0)return;const group=this.getGroup(currentFilteredItem),choice=this.getChoice(currentFilteredItem);let listOfModifiedDragDrop=[];this.getRoot().find(".group"+group+".choice"+choice).each((function(i,node){if($(node).get(0)===currentFilteredItem.get(0))return;const originalClass=$(node).attr("class"),originalStyle=$(node).attr("style"),filteredDragDropClone=currentFilteredItem.clone();questionManager.addEventHandlersToDrag(filteredDragDropClone),filteredDragDropClone.attr("class",originalClass),filteredDragDropClone.attr("style",originalStyle),$(node).before(filteredDragDropClone),listOfModifiedDragDrop.push(node)})),listOfModifiedDragDrop.forEach((function(node){$(node).remove()}));const currentHeight=currentFilteredItem.height(),currentWidth=currentFilteredItem.width();if(currentFilteredItem.height("auto"),currentFilteredItem.width("auto"),filteredElement.offsetWidth&&filteredElement.offsetHeight||filteredElement.classList.add("d-block"),this.questionDragDropWidthHeight[group].maxWidth0?this.imageLoadingTimeoutId=setTimeout((function(){thisQ.waitForAllImagesToBeLoaded()}),100):(this.allImagesLoaded=!0,thisQ.setupQuestion(),document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete,(elements=>{elements.detail.nodes.forEach((element=>{thisQ.changeAllDragsAndDropsToFilteredContent(element)}))}))))},DragDropOntoImageQuestion.prototype.getNotYetLoadedImages=function(){var thisQ=this;return this.getRoot().find(".ddarea img").not((function(i,imgNode){return thisQ.imageIsLoaded(imgNode)}))},DragDropOntoImageQuestion.prototype.imageIsLoaded=function(imgElement){return imgElement.complete&&0!==imgElement.naturalHeight},DragDropOntoImageQuestion.prototype.setupQuestion=function(){this.resizeAllDragsAndDrops(),this.cloneDrags(),this.positionDragsAndDrops(),M.util.js_complete("qtype_ddimageortext-init-"+this.containerId)},DragDropOntoImageQuestion.prototype.resizeAllDragsAndDrops=function(){var thisQ=this;this.getRoot().find(".draghomes > div").each((function(i,node){thisQ.resizeAllDragsAndDropsInGroup(thisQ.getClassnameNumericSuffix($(node),"dragitemgroup"))}))},DragDropOntoImageQuestion.prototype.resizeAllDragsAndDropsInGroup=function(group){var root=this.getRoot(),dragHomes=root.find(".draghome.group"+group),maxWidth=0,maxHeight=0;for(var i in dragHomes.each((function(i,drag){maxWidth=Math.max(maxWidth,Math.ceil(drag.offsetWidth)),maxHeight=Math.max(maxHeight,Math.ceil(drag.offsetHeight))})),maxWidth+=10,maxHeight+=10,this.questionDragDropWidthHeight[group]={maxWidth:maxWidth,maxHeight:maxHeight},dragHomes.each((function(i,drag){const top=Math.floor((maxHeight-drag.offsetHeight)/2);$(drag).width(maxWidth).height(maxHeight).css({"padding-top":top+"px"})})),this.places)if(this.places.hasOwnProperty(i)){var place=this.places[i],label=place.text;parseInt(place.group)===group&&(""===label&&(label=M.util.get_string("blank","qtype_ddimageortext")),0===root.find(".dropzones .dropzone.group"+place.group+".place"+i).length&&root.find(".dropzones").append('
'+label+" 
"),root.find(".dropzone.place"+i).width(maxWidth-2).height(maxHeight-2))}},DragDropOntoImageQuestion.prototype.cloneDrags=function(){var thisQ=this;thisQ.getRoot().find(".draghome").each((function(index,dragHome){var drag=$(dragHome),placeHolder=drag.clone();placeHolder.removeClass(),placeHolder.addClass("draghome choice"+thisQ.getChoice(drag)+" group"+thisQ.getGroup(drag)+" dragplaceholder"),drag.before(placeHolder)}))},DragDropOntoImageQuestion.prototype.cloneDragsForOneChoice=function(dragHome){if(dragHome.hasClass("infinite"))for(var noOfDrags=this.noOfDropsInGroup(this.getGroup(dragHome)),i=0;i0&&"0"===choice)){var place=thisQ.getPlace(input),unplacedDrag=thisQ.getUnplacedChoice(thisQ.getGroup(input),choice),hiddenDrag=thisQ.getDragClone(unplacedDrag);if(hiddenDrag.length)if(unplacedDrag.hasClass("infinite")){var noOfDrags=thisQ.noOfDropsInGroup(thisQ.getGroup(unplacedDrag));if(thisQ.getInfiniteDragClones(unplacedDrag,!1).length{result[inputNode.id]=inputNode.value})),result},DragDropOntoImageQuestion.prototype.isQuestionInteracted=function(){const oldAnswer=this.questionAnswer,newAnswer=this.getQuestionAnsweredValues();let isInteracted=!1;return JSON.stringify(newAnswer)!==JSON.stringify(oldAnswer)?(isInteracted=!0,isInteracted):(Object.keys(newAnswer).forEach((key=>{newAnswer[key]!==oldAnswer[key]&&(isInteracted=!0)})),isInteracted)},DragDropOntoImageQuestion.prototype.handleDragStart=function(e){var thisQ=this,drag=$(e.target).closest(".draghome"),newIndex=this.calculateZIndex()+2;if(dragDrop.prepare(e).start&&!drag.hasClass("beingdragged")){drag.addClass("beingdragged").css("transform","").css("z-index",newIndex);var currentPlace=this.getClassnameNumericSuffix(drag,"inplace");if(null!==currentPlace){this.setInputValue(currentPlace,0),drag.removeClass("inplace"+currentPlace);var hiddenDrop=thisQ.getDrop(drag,currentPlace);hiddenDrop.length&&(hiddenDrop.addClass("active"),drag.offset(hiddenDrop.offset()))}else{var hiddenDrag=thisQ.getDragClone(drag);if(hiddenDrag.length)if(drag.hasClass("infinite")){var noOfDrags=this.noOfDropsInGroup(thisQ.getGroup(drag));if(this.getInfiniteDragClones(drag,!1).length1;)choice--,previous=this.getUnplacedChoice(group,choice);return previous},DragDropOntoImageQuestion.prototype.animateTo=function(drag,target){var currentPos=drag.offset(),targetPos=target.offset(),thisQ=this;M.util.js_pending("qtype_ddimageortext-animate-"+thisQ.containerId),drag.animate({left:parseInt(drag.css("left"))+targetPos.left-currentPos.left,top:parseInt(drag.css("top"))+targetPos.top-currentPos.top},{duration:"fast",done:function(){$("body").trigger("qtype_ddimageortext-dragmoved",[drag,target,thisQ]),M.util.js_complete("qtype_ddimageortext-animate-"+thisQ.containerId)}})},DragDropOntoImageQuestion.prototype.isPointInDrop=function(pageX,pageY,drop){var position=drop.offset();return drop.hasClass("draghome")?pageX>=position.left&&pageX=position.top&&pageY=position.left&&pageX=position.top&&pageYzIndex&&(zIndex=itemZIndex)})),zIndex},DragDropOntoImageQuestion.prototype.isDragSameAsDrop=function(drag,drop){return this.getChoice(drag)===this.getChoice(drop)&&this.getGroup(drag)===this.getGroup(drop)};var questionManager={eventHandlersInitialised:!1,dragEventHandlersInitialised:{},isPrinting:!1,isKeyboardNavigation:!1,questions:{},init:function(containerId,readOnly){const places=JSON.parse(document.querySelector("#"+containerId+" .dropzones").dataset.placeInfo);if(questionManager.questions[containerId]=new DragDropOntoImageQuestion(containerId,readOnly,places),questionManager.eventHandlersInitialised||(questionManager.setupEventHandlers(),questionManager.eventHandlersInitialised=!0),!questionManager.dragEventHandlersInitialised.hasOwnProperty(containerId)){questionManager.dragEventHandlersInitialised[containerId]=!0;var questionContainer=document.getElementById(containerId);questionContainer.classList.contains("ddimageortext")&&!questionContainer.classList.contains("qtype_ddimageortext-readonly")&&questionManager.addEventHandlersToDrag($(questionContainer).find(".draghome"))}},setupEventHandlers:function(){$("body").on("keydown",".que.ddimageortext:not(.qtype_ddimageortext-readonly) .dropzones .dropzone",questionManager.handleKeyPress).on("keydown",".que.ddimageortext:not(.qtype_ddimageortext-readonly) .draghome.placed:not(.beingdragged)",questionManager.handleKeyPress).on("qtype_ddimageortext-dragmoved",questionManager.handleDragMoved),$(window).on("resize",(function(){questionManager.handleWindowResize(!1)})),window.addEventListener("beforeprint",(function(){questionManager.isPrinting=!0,questionManager.handleWindowResize(questionManager.isPrinting)})),window.addEventListener("afterprint",(function(){questionManager.isPrinting=!1,questionManager.handleWindowResize(questionManager.isPrinting)})),setTimeout((function(){questionManager.fixLayoutIfThingsMoved()}),100)},addEventHandlersToDrag:function(element){element.unbind("mousedown touchstart"),element.on("mousedown touchstart",questionManager.handleDragStart)},handleDragStart:function(e){e.preventDefault();var question=questionManager.getQuestionForEvent(e);question&&question.handleDragStart(e)},handleKeyPress:function(e){if(!questionManager.isKeyboardNavigation){questionManager.isKeyboardNavigation=!0;var question=questionManager.getQuestionForEvent(e);question&&question.handleKeyPress(e)}},handleWindowResize:function(isPrinting){for(var containerId in questionManager.questions)questionManager.questions.hasOwnProperty(containerId)&&(questionManager.questions[containerId].isPrinting=isPrinting,questionManager.questions[containerId].handleResize())},fixLayoutIfThingsMoved:function(){this.handleWindowResize(questionManager.isPrinting),setTimeout((function(){questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting)}),100)},handleDragMoved:function(e,drag,target,thisQ){drag.removeClass("beingdragged").css("z-index",""),drag.css("top",target.position().top).css("left",target.position().left),target.after(drag),target.removeClass("active"),void 0!==drag.data("unplaced")&&!0===drag.data("unplaced")?(drag.removeClass("placed").addClass("unplaced"),drag.removeAttr("tabindex"),drag.removeData("unplaced"),drag.css("top","").css("left","").css("transform",""),drag.hasClass("infinite")&&thisQ.getInfiniteDragClones(drag,!0).length>1&&thisQ.getInfiniteDragClones(drag,!0).first().remove()):(drag.data("originX",target.data("originX")).data("originY",target.data("originY")),thisQ.handleElementScale(drag,"left top")),void 0!==drag.data("isfocus")&&!0===drag.data("isfocus")&&(drag.focus(),drag.removeData("isfocus")),void 0!==target.data("isfocus")&&!0===target.data("isfocus")&&target.removeData("isfocus"),questionManager.isKeyboardNavigation&&(questionManager.isKeyboardNavigation=!1),thisQ.isQuestionInteracted()&&(questionManager.handleFormDirty(),thisQ.questionAnswer=thisQ.getQuestionAnsweredValues())},getQuestionForEvent:function(e){var containerId=$(e.currentTarget).closest(".que.ddimageortext").attr("id");return questionManager.questions[containerId]},handleFormDirty:function(){const responseForm=document.getElementById("responseform");FormChangeChecker.markFormAsDirty(responseForm)}};return{init:questionManager.init}})); +define("qtype_ddimageortext/question",["jquery","core/dragdrop","core/key_codes","core_form/changechecker","core_filters/events"],(function($,dragDrop,keys,FormChangeChecker,filterEvent){function DragDropOntoImageQuestion(containerId,readOnly,places){this.containerId=containerId,this.questionAnswer={},this.questionDragDropWidthHeight=[],M.util.js_pending("qtype_ddimageortext-init-"+this.containerId),this.places=places,this.allImagesLoaded=!1,this.imageLoadingTimeoutId=null,this.isPrinting=!1,readOnly&&this.getRoot().addClass("qtype_ddimageortext-readonly");var thisQ=this;this.getNotYetLoadedImages().one("load",(function(){thisQ.waitForAllImagesToBeLoaded()})),this.waitForAllImagesToBeLoaded()}DragDropOntoImageQuestion.prototype.changeAllDragsAndDropsToFilteredContent=function(filteredElement){let currentFilteredItem=$(filteredElement);const parentIsDD=currentFilteredItem.parent().closest("div").hasClass("placed")||currentFilteredItem.parent().hasClass("draghome"),isDD=currentFilteredItem.hasClass("placed")||currentFilteredItem.hasClass("draghome");if(!parentIsDD&&!isDD)return;if(parentIsDD&&(currentFilteredItem=currentFilteredItem.parent().closest("div")),this.getRoot().find(currentFilteredItem).length<=0)return;const group=this.getGroup(currentFilteredItem),choice=this.getChoice(currentFilteredItem);let listOfModifiedDragDrop=[];this.getRoot().find(".group"+group+".choice"+choice).each((function(i,node){if($(node).get(0)===currentFilteredItem.get(0))return;const originalClass=$(node).attr("class"),originalStyle=$(node).attr("style"),filteredDragDropClone=currentFilteredItem.clone();questionManager.addEventHandlersToDrag(filteredDragDropClone),filteredDragDropClone.attr("class",originalClass),filteredDragDropClone.attr("style",originalStyle),$(node).before(filteredDragDropClone),listOfModifiedDragDrop.push(node)})),listOfModifiedDragDrop.forEach((function(node){$(node).remove()}));const currentHeight=currentFilteredItem.height(),currentWidth=currentFilteredItem.width();if(currentFilteredItem.height("auto"),currentFilteredItem.width("auto"),filteredElement.offsetWidth&&filteredElement.offsetHeight||filteredElement.classList.add("d-block"),this.questionDragDropWidthHeight[group].maxWidth0?this.imageLoadingTimeoutId=setTimeout((function(){thisQ.waitForAllImagesToBeLoaded()}),100):(this.allImagesLoaded=!0,thisQ.setupQuestion(),document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete,(elements=>{elements.detail.nodes.forEach((element=>{thisQ.changeAllDragsAndDropsToFilteredContent(element)}))}))))},DragDropOntoImageQuestion.prototype.getNotYetLoadedImages=function(){var thisQ=this;return this.getRoot().find(".ddarea img").not((function(i,imgNode){return thisQ.imageIsLoaded(imgNode)}))},DragDropOntoImageQuestion.prototype.imageIsLoaded=function(imgElement){return imgElement.complete&&0!==imgElement.naturalHeight},DragDropOntoImageQuestion.prototype.setupQuestion=function(){this.resizeAllDragsAndDrops(),this.cloneDrags(),this.positionDragsAndDrops(),M.util.js_complete("qtype_ddimageortext-init-"+this.containerId)},DragDropOntoImageQuestion.prototype.resizeAllDragsAndDrops=function(){var thisQ=this;this.getRoot().find(".draghomes > div").each((function(i,node){thisQ.resizeAllDragsAndDropsInGroup(thisQ.getClassnameNumericSuffix($(node),"dragitemgroup"))}))},DragDropOntoImageQuestion.prototype.resizeAllDragsAndDropsInGroup=function(group){var root=this.getRoot(),dragHomes=root.find(".draghome.group"+group),maxWidth=0,maxHeight=0;for(var i in dragHomes.each((function(i,drag){maxWidth=Math.max(maxWidth,Math.ceil(drag.offsetWidth)),maxHeight=Math.max(maxHeight,Math.ceil(drag.offsetHeight))})),maxWidth+=10,maxHeight+=10,this.questionDragDropWidthHeight[group]={maxWidth:maxWidth,maxHeight:maxHeight},dragHomes.each((function(i,drag){const top=Math.floor((maxHeight-drag.offsetHeight)/2);$(drag).width(maxWidth).height(maxHeight).css({"padding-top":top+"px"})})),this.places)if(this.places.hasOwnProperty(i)){var place=this.places[i],label=place.text;parseInt(place.group)===group&&(""===label&&(label=M.util.get_string("blank","qtype_ddimageortext")),0===root.find(".dropzones .dropzone.group"+place.group+".place"+i).length&&root.find(".dropzones").append('
'+label+" 
"),root.find(".dropzone.place"+i).width(maxWidth-2).height(maxHeight-2))}},DragDropOntoImageQuestion.prototype.cloneDrags=function(){var thisQ=this;thisQ.getRoot().find(".draghome").each((function(index,dragHome){var drag=$(dragHome),placeHolder=drag.clone();placeHolder.removeClass(),placeHolder.addClass("draghome choice"+thisQ.getChoice(drag)+" group"+thisQ.getGroup(drag)+" dragplaceholder"),drag.before(placeHolder)}))},DragDropOntoImageQuestion.prototype.cloneDragsForOneChoice=function(dragHome){if(dragHome.hasClass("infinite"))for(var noOfDrags=this.noOfDropsInGroup(this.getGroup(dragHome)),i=0;i0&&"0"===choice)){var place=thisQ.getPlace(input),unplacedDrag=thisQ.getUnplacedChoice(thisQ.getGroup(input),choice),hiddenDrag=thisQ.getDragClone(unplacedDrag);if(hiddenDrag.length)if(unplacedDrag.hasClass("infinite")){var noOfDrags=thisQ.noOfDropsInGroup(thisQ.getGroup(unplacedDrag));if(thisQ.getInfiniteDragClones(unplacedDrag,!1).length{result[inputNode.id]=inputNode.value})),result},DragDropOntoImageQuestion.prototype.isQuestionInteracted=function(){const oldAnswer=this.questionAnswer,newAnswer=this.getQuestionAnsweredValues();let isInteracted=!1;return JSON.stringify(newAnswer)!==JSON.stringify(oldAnswer)?(isInteracted=!0,isInteracted):(Object.keys(newAnswer).forEach((key=>{newAnswer[key]!==oldAnswer[key]&&(isInteracted=!0)})),isInteracted)},DragDropOntoImageQuestion.prototype.handleDragStart=function(e){var thisQ=this,drag=$(e.target).closest(".draghome"),newIndex=this.calculateZIndex()+2;if(dragDrop.prepare(e).start&&!drag.hasClass("beingdragged")){drag.addClass("beingdragged").css("transform","").css("z-index",newIndex);var currentPlace=this.getClassnameNumericSuffix(drag,"inplace");if(null!==currentPlace){this.setInputValue(currentPlace,0),drag.removeClass("inplace"+currentPlace);var hiddenDrop=thisQ.getDrop(drag,currentPlace);hiddenDrop.length&&(hiddenDrop.addClass("active"),drag.offset(hiddenDrop.offset()))}else{var hiddenDrag=thisQ.getDragClone(drag);if(hiddenDrag.length)if(drag.hasClass("infinite")){var noOfDrags=this.noOfDropsInGroup(thisQ.getGroup(drag));if(this.getInfiniteDragClones(drag,!1).length1;)choice--,previous=this.getUnplacedChoice(group,choice);return previous},DragDropOntoImageQuestion.prototype.animateTo=function(drag,target){var currentPos=drag.offset(),targetPos=target.offset(),thisQ=this;M.util.js_pending("qtype_ddimageortext-animate-"+thisQ.containerId),drag.animate({left:parseInt(drag.css("left"))+targetPos.left-currentPos.left,top:parseInt(drag.css("top"))+targetPos.top-currentPos.top},{duration:"fast",done:function(){$("body").trigger("qtype_ddimageortext-dragmoved",[drag,target,thisQ]),M.util.js_complete("qtype_ddimageortext-animate-"+thisQ.containerId)}})},DragDropOntoImageQuestion.prototype.isPointInDrop=function(pageX,pageY,drop){var position=drop.offset();return drop.hasClass("draghome")?pageX>=position.left&&pageX=position.top&&pageY=position.left&&pageX=position.top&&pageYzIndex&&(zIndex=itemZIndex)})),zIndex},DragDropOntoImageQuestion.prototype.isDragSameAsDrop=function(drag,drop){return this.getChoice(drag)===this.getChoice(drop)&&this.getGroup(drag)===this.getGroup(drop)};var questionManager={eventHandlersInitialised:!1,dragEventHandlersInitialised:{},isPrinting:!1,isKeyboardNavigation:!1,questions:{},init:function(containerId,readOnly,places){if(questionManager.questions[containerId]=new DragDropOntoImageQuestion(containerId,readOnly,places),questionManager.eventHandlersInitialised||(questionManager.setupEventHandlers(),questionManager.eventHandlersInitialised=!0),!questionManager.dragEventHandlersInitialised.hasOwnProperty(containerId)){questionManager.dragEventHandlersInitialised[containerId]=!0;var questionContainer=document.getElementById(containerId);questionContainer.classList.contains("ddimageortext")&&!questionContainer.classList.contains("qtype_ddimageortext-readonly")&&questionManager.addEventHandlersToDrag($(questionContainer).find(".draghome"))}},setupEventHandlers:function(){$("body").on("keydown",".que.ddimageortext:not(.qtype_ddimageortext-readonly) .dropzones .dropzone",questionManager.handleKeyPress).on("keydown",".que.ddimageortext:not(.qtype_ddimageortext-readonly) .draghome.placed:not(.beingdragged)",questionManager.handleKeyPress).on("qtype_ddimageortext-dragmoved",questionManager.handleDragMoved),$(window).on("resize",(function(){questionManager.handleWindowResize(!1)})),window.addEventListener("beforeprint",(function(){questionManager.isPrinting=!0,questionManager.handleWindowResize(questionManager.isPrinting)})),window.addEventListener("afterprint",(function(){questionManager.isPrinting=!1,questionManager.handleWindowResize(questionManager.isPrinting)})),setTimeout((function(){questionManager.fixLayoutIfThingsMoved()}),100)},addEventHandlersToDrag:function(element){element.unbind("mousedown touchstart"),element.on("mousedown touchstart",questionManager.handleDragStart)},handleDragStart:function(e){e.preventDefault();var question=questionManager.getQuestionForEvent(e);question&&question.handleDragStart(e)},handleKeyPress:function(e){if(!questionManager.isKeyboardNavigation){questionManager.isKeyboardNavigation=!0;var question=questionManager.getQuestionForEvent(e);question&&question.handleKeyPress(e)}},handleWindowResize:function(isPrinting){for(var containerId in questionManager.questions)questionManager.questions.hasOwnProperty(containerId)&&(questionManager.questions[containerId].isPrinting=isPrinting,questionManager.questions[containerId].handleResize())},fixLayoutIfThingsMoved:function(){this.handleWindowResize(questionManager.isPrinting),setTimeout((function(){questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting)}),100)},handleDragMoved:function(e,drag,target,thisQ){drag.removeClass("beingdragged").css("z-index",""),drag.css("top",target.position().top).css("left",target.position().left),target.after(drag),target.removeClass("active"),void 0!==drag.data("unplaced")&&!0===drag.data("unplaced")?(drag.removeClass("placed").addClass("unplaced"),drag.removeAttr("tabindex"),drag.removeData("unplaced"),drag.css("top","").css("left","").css("transform",""),drag.hasClass("infinite")&&thisQ.getInfiniteDragClones(drag,!0).length>1&&thisQ.getInfiniteDragClones(drag,!0).first().remove()):(drag.data("originX",target.data("originX")).data("originY",target.data("originY")),thisQ.handleElementScale(drag,"left top")),void 0!==drag.data("isfocus")&&!0===drag.data("isfocus")&&(drag.focus(),drag.removeData("isfocus")),void 0!==target.data("isfocus")&&!0===target.data("isfocus")&&target.removeData("isfocus"),questionManager.isKeyboardNavigation&&(questionManager.isKeyboardNavigation=!1),thisQ.isQuestionInteracted()&&(questionManager.handleFormDirty(),thisQ.questionAnswer=thisQ.getQuestionAnsweredValues())},getQuestionForEvent:function(e){var containerId=$(e.currentTarget).closest(".que.ddimageortext").attr("id");return questionManager.questions[containerId]},handleFormDirty:function(){const responseForm=document.getElementById("responseform");FormChangeChecker.markFormAsDirty(responseForm)}};return{init:questionManager.init}})); //# sourceMappingURL=question.min.js.map \ No newline at end of file diff --git a/question/type/ddimageortext/amd/build/question.min.js.map b/question/type/ddimageortext/amd/build/question.min.js.map index c3cabed87c0..814f71e5432 100644 --- a/question/type/ddimageortext/amd/build/question.min.js.map +++ b/question/type/ddimageortext/amd/build/question.min.js.map @@ -1 +1 @@ -{"version":3,"file":"question.min.js","sources":["../src/question.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/*\n * JavaScript to allow dragging options to slots (using mouse down or touch) or tab through slots using keyboard.\n *\n * @module qtype_ddimageortext/question\n * @copyright 2018 The Open University\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\ndefine([\n 'jquery',\n 'core/dragdrop',\n 'core/key_codes',\n 'core_form/changechecker',\n 'core_filters/events',\n], function(\n $,\n dragDrop,\n keys,\n FormChangeChecker,\n filterEvent\n) {\n\n \"use strict\";\n\n /**\n * Initialise one drag-drop onto image question.\n *\n * @param {String} containerId id of the outer div for this question.\n * @param {boolean} readOnly whether the question is being displayed read-only.\n * @param {Array} places Information about the drop places.\n * @constructor\n */\n function DragDropOntoImageQuestion(containerId, readOnly, places) {\n this.containerId = containerId;\n this.questionAnswer = {};\n this.questionDragDropWidthHeight = [];\n M.util.js_pending('qtype_ddimageortext-init-' + this.containerId);\n this.places = places;\n this.allImagesLoaded = false;\n this.imageLoadingTimeoutId = null;\n this.isPrinting = false;\n if (readOnly) {\n this.getRoot().addClass('qtype_ddimageortext-readonly');\n }\n\n var thisQ = this;\n this.getNotYetLoadedImages().one('load', function() {\n thisQ.waitForAllImagesToBeLoaded();\n });\n this.waitForAllImagesToBeLoaded();\n }\n\n /**\n * Change all the drags and drops related to the item that has been changed by filter to correct size and content.\n *\n * @param {object} filteredElement the element has been modified by filter.\n */\n DragDropOntoImageQuestion.prototype.changeAllDragsAndDropsToFilteredContent = function(filteredElement) {\n let currentFilteredItem = $(filteredElement);\n const parentIsDD = currentFilteredItem.parent().closest('div').hasClass('placed') ||\n currentFilteredItem.parent().hasClass('draghome');\n const isDD = currentFilteredItem.hasClass('placed') || currentFilteredItem.hasClass('draghome');\n // The filtered element or parent element should a drag or drop item.\n if (!parentIsDD && !isDD) {\n return;\n }\n if (parentIsDD) {\n currentFilteredItem = currentFilteredItem.parent().closest('div');\n }\n if (this.getRoot().find(currentFilteredItem).length <= 0) {\n // If the DD item doesn't belong to this question\n // In case we have multiple questions in the same page.\n return;\n }\n const group = this.getGroup(currentFilteredItem),\n choice = this.getChoice(currentFilteredItem);\n let listOfModifiedDragDrop = [];\n // Get the list of drag and drop item within the same group and choice.\n this.getRoot().find('.group' + group + '.choice' + choice).each(function(i, node) {\n // Same modified item, skip it.\n if ($(node).get(0) === currentFilteredItem.get(0)) {\n return;\n }\n const originalClass = $(node).attr('class');\n const originalStyle = $(node).attr('style');\n // We want to keep all the handler and event for filtered item, so using clone is the only choice.\n const filteredDragDropClone = currentFilteredItem.clone();\n // Sometimes, for the question that has a lot of input groups and unlimited draggable items,\n // this 'clone' process takes longer than usual,it will not add the eventHandler for this cloned drag.\n // We need to make sure to add the eventHandler for the cloned drag too.\n questionManager.addEventHandlersToDrag(filteredDragDropClone);\n // Replace the class and style of the drag drop item we want to replace for the clone.\n filteredDragDropClone.attr('class', originalClass);\n filteredDragDropClone.attr('style', originalStyle);\n // Insert into DOM.\n $(node).before(filteredDragDropClone);\n // Add the item has been replaced to a list so we can remove it later.\n listOfModifiedDragDrop.push(node);\n });\n\n listOfModifiedDragDrop.forEach(function(node) {\n $(node).remove();\n });\n // Save the current height and width.\n const currentHeight = currentFilteredItem.height();\n const currentWidth = currentFilteredItem.width();\n // Set to auto, so we can get the real height and width of the filtered item.\n currentFilteredItem.height('auto');\n currentFilteredItem.width('auto');\n // We need to set display block so we can get height and width.\n // Some browsers can't get the offsetWidth/Height if they are an inline element like span tag.\n if (!filteredElement.offsetWidth || !filteredElement.offsetHeight) {\n filteredElement.classList.add('d-block');\n }\n if (this.questionDragDropWidthHeight[group].maxWidth < Math.ceil(filteredElement.offsetWidth) ||\n this.questionDragDropWidthHeight[group].maxHeight < Math.ceil(0 + filteredElement.offsetHeight)) {\n // Remove the d-block class before calculation.\n filteredElement.classList.remove('d-block');\n // Now resize all the items in the same group if we have new maximum width or height.\n this.resizeAllDragsAndDropsInGroup(group);\n } else {\n // Calculate the top padding.\n const top = Math.floor((this.questionDragDropWidthHeight[group].maxHeight - filteredElement.offsetHeight) / 2);\n // Set top padding so the content of filtered item is center again.\n currentFilteredItem.width(currentWidth).height(currentHeight).css({\n 'padding-top': top + 'px',\n });\n }\n // Remove the d-block class after resize.\n filteredElement.classList.remove('d-block');\n };\n\n /**\n * Waits until all images are loaded before calling setupQuestion().\n *\n * This function is called from the onLoad of each image, and also polls with\n * a time-out, because image on-loads are allegedly unreliable.\n */\n DragDropOntoImageQuestion.prototype.waitForAllImagesToBeLoaded = function() {\n var thisQ = this;\n\n // This method may get called multiple times (via image on-loads or timeouts.\n // If we are already done, don't do it again.\n if (this.allImagesLoaded) {\n return;\n }\n\n // Clear any current timeout, if set.\n if (this.imageLoadingTimeoutId !== null) {\n clearTimeout(this.imageLoadingTimeoutId);\n }\n\n // If we have not yet loaded all images, set a timeout to\n // call ourselves again, since apparently images on-load\n // events are flakey.\n if (this.getNotYetLoadedImages().length > 0) {\n this.imageLoadingTimeoutId = setTimeout(function() {\n thisQ.waitForAllImagesToBeLoaded();\n }, 100);\n return;\n }\n\n // We now have all images. Carry on, but only after giving the layout a chance to settle down.\n this.allImagesLoaded = true;\n thisQ.setupQuestion();\n // Wait for all dynamic content loaded by filter to be completed.\n document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete, (elements) => {\n elements.detail.nodes.forEach((element) => {\n thisQ.changeAllDragsAndDropsToFilteredContent(element);\n });\n });\n };\n\n /**\n * Get any of the images in the drag-drop area that are not yet fully loaded.\n *\n * @returns {jQuery} those images.\n */\n DragDropOntoImageQuestion.prototype.getNotYetLoadedImages = function() {\n var thisQ = this;\n return this.getRoot().find('.ddarea img').not(function(i, imgNode) {\n return thisQ.imageIsLoaded(imgNode);\n });\n };\n\n /**\n * Check if an image has loaded without errors.\n *\n * @param {HTMLImageElement} imgElement an image.\n * @returns {boolean} true if this image has loaded without errors.\n */\n DragDropOntoImageQuestion.prototype.imageIsLoaded = function(imgElement) {\n return imgElement.complete && imgElement.naturalHeight !== 0;\n };\n\n /**\n * Set up the question, once all images have been loaded.\n */\n DragDropOntoImageQuestion.prototype.setupQuestion = function() {\n this.resizeAllDragsAndDrops();\n this.cloneDrags();\n this.positionDragsAndDrops();\n M.util.js_complete('qtype_ddimageortext-init-' + this.containerId);\n };\n\n /**\n * In each group, resize all the items to be the same size.\n */\n DragDropOntoImageQuestion.prototype.resizeAllDragsAndDrops = function() {\n var thisQ = this;\n this.getRoot().find('.draghomes > div').each(function(i, node) {\n thisQ.resizeAllDragsAndDropsInGroup(\n thisQ.getClassnameNumericSuffix($(node), 'dragitemgroup'));\n });\n };\n\n /**\n * In a given group, set all the drags and drops to be the same size.\n *\n * @param {int} group the group number.\n */\n DragDropOntoImageQuestion.prototype.resizeAllDragsAndDropsInGroup = function(group) {\n var root = this.getRoot(),\n dragHomes = root.find(\".draghome.group\" + group),\n maxWidth = 0,\n maxHeight = 0;\n\n // Find the maximum size of any drag in this groups.\n dragHomes.each(function(i, drag) {\n maxWidth = Math.max(maxWidth, Math.ceil(drag.offsetWidth));\n maxHeight = Math.max(maxHeight, Math.ceil(drag.offsetHeight));\n });\n\n // The size we will want to set is a bit bigger than this.\n maxWidth += 10;\n maxHeight += 10;\n this.questionDragDropWidthHeight[group] = {maxWidth, maxHeight};\n\n // Set each drag home to that size.\n dragHomes.each(function(i, drag) {\n const top = Math.floor((maxHeight - drag.offsetHeight) / 2);\n // Set top padding so the item is centred.\n $(drag).width(maxWidth).height(maxHeight).css({\n 'padding-top': top + 'px',\n });\n });\n\n // Create the drops and make them the right size.\n for (var i in this.places) {\n if (!this.places.hasOwnProperty((i))) {\n continue;\n }\n var place = this.places[i],\n label = place.text;\n if (parseInt(place.group) !== group) {\n continue;\n }\n if (label === '') {\n label = M.util.get_string('blank', 'qtype_ddimageortext');\n }\n if (root.find('.dropzones .dropzone.group' + place.group + '.place' + i).length === 0) {\n root.find('.dropzones').append('
' +\n '' + label + ' 
');\n }\n root.find('.dropzone.place' + i).width(maxWidth - 2).height(maxHeight - 2);\n }\n };\n\n /**\n * Invisible 'drag homes' are output by the renderer. These have the same properties\n * as the drag items but are invisible. We clone these invisible elements to make the\n * actual drag items.\n */\n DragDropOntoImageQuestion.prototype.cloneDrags = function() {\n var thisQ = this;\n thisQ.getRoot().find('.draghome').each(function(index, dragHome) {\n var drag = $(dragHome);\n var placeHolder = drag.clone();\n placeHolder.removeClass();\n placeHolder.addClass('draghome choice' +\n thisQ.getChoice(drag) + ' group' +\n thisQ.getGroup(drag) + ' dragplaceholder');\n drag.before(placeHolder);\n });\n };\n\n /**\n * Clone drag item for one choice.\n *\n * @param {jQuery} dragHome the drag home to clone.\n */\n DragDropOntoImageQuestion.prototype.cloneDragsForOneChoice = function(dragHome) {\n if (dragHome.hasClass('infinite')) {\n var noOfDrags = this.noOfDropsInGroup(this.getGroup(dragHome));\n for (var i = 0; i < noOfDrags; i++) {\n this.cloneDrag(dragHome);\n }\n } else {\n this.cloneDrag(dragHome);\n }\n };\n\n /**\n * Clone drag item.\n *\n * @param {jQuery} dragHome\n */\n DragDropOntoImageQuestion.prototype.cloneDrag = function(dragHome) {\n var drag = dragHome.clone();\n drag.removeClass('draghome')\n .addClass('drag unplaced moodle-has-zindex')\n .offset(dragHome.offset());\n this.getRoot().find('.dragitems').append(drag);\n };\n\n /**\n * Update the position of drags.\n */\n DragDropOntoImageQuestion.prototype.positionDragsAndDrops = function() {\n var thisQ = this,\n root = this.getRoot(),\n bgRatio = this.bgRatio();\n\n // Move the drops into position.\n root.find('.ddarea .dropzone').each(function(i, dropNode) {\n var drop = $(dropNode),\n place = thisQ.places[thisQ.getPlace(drop)];\n // The xy values come from PHP as strings, so we need parseInt to stop JS doing string concatenation.\n drop.css('left', parseInt(place.xy[0]) * bgRatio)\n .css('top', parseInt(place.xy[1]) * bgRatio);\n drop.data('originX', parseInt(place.xy[0]))\n .data('originY', parseInt(place.xy[1]));\n thisQ.handleElementScale(drop, 'left top');\n });\n\n // First move all items back home.\n root.find('.draghome').not('.dragplaceholder').each(function(i, dragNode) {\n var drag = $(dragNode),\n currentPlace = thisQ.getClassnameNumericSuffix(drag, 'inplace');\n drag.addClass('unplaced')\n .removeClass('placed');\n drag.removeAttr('tabindex');\n if (currentPlace !== null) {\n drag.removeClass('inplace' + currentPlace);\n }\n });\n\n // Then place the ones that should be placed.\n root.find('input.placeinput').each(function(i, inputNode) {\n var input = $(inputNode),\n choice = input.val();\n if (choice.length === 0 || (choice.length > 0 && choice === '0')) {\n // No item in this place.\n return;\n }\n\n var place = thisQ.getPlace(input);\n // Get the unplaced drag.\n var unplacedDrag = thisQ.getUnplacedChoice(thisQ.getGroup(input), choice);\n // Get the clone of the drag.\n var hiddenDrag = thisQ.getDragClone(unplacedDrag);\n if (hiddenDrag.length) {\n if (unplacedDrag.hasClass('infinite')) {\n var noOfDrags = thisQ.noOfDropsInGroup(thisQ.getGroup(unplacedDrag));\n var cloneDrags = thisQ.getInfiniteDragClones(unplacedDrag, false);\n if (cloneDrags.length < noOfDrags) {\n var cloneDrag = unplacedDrag.clone();\n cloneDrag.removeClass('beingdragged');\n cloneDrag.removeAttr('tabindex');\n hiddenDrag.after(cloneDrag);\n // Sometimes, for the question that has a lot of input groups and unlimited draggable items,\n // this 'clone' process takes longer than usual, so the questionManager.init() method\n // will not add the eventHandler for this cloned drag.\n // We need to make sure to add the eventHandler for the cloned drag too.\n questionManager.addEventHandlersToDrag(cloneDrag);\n } else {\n hiddenDrag.addClass('active');\n }\n } else {\n hiddenDrag.addClass('active');\n }\n }\n\n // Send the drag to drop.\n var drop = root.find('.dropzone.place' + place);\n thisQ.sendDragToDrop(unplacedDrag, drop);\n });\n\n // Save the question answer.\n thisQ.questionAnswer = thisQ.getQuestionAnsweredValues();\n };\n\n /**\n * Get the question answered values.\n *\n * @return {Object} Contain key-value with key is the input id and value is the input value.\n */\n DragDropOntoImageQuestion.prototype.getQuestionAnsweredValues = function() {\n let result = {};\n this.getRoot().find('input.placeinput').each((i, inputNode) => {\n result[inputNode.id] = inputNode.value;\n });\n\n return result;\n };\n\n /**\n * Check if the question is being interacted or not.\n *\n * @return {boolean} Return true if the user has changed the question-answer.\n */\n DragDropOntoImageQuestion.prototype.isQuestionInteracted = function() {\n const oldAnswer = this.questionAnswer;\n const newAnswer = this.getQuestionAnsweredValues();\n let isInteracted = false;\n\n // First, check both answers have the same structure or not.\n if (JSON.stringify(newAnswer) !== JSON.stringify(oldAnswer)) {\n isInteracted = true;\n return isInteracted;\n }\n // Check the values.\n Object.keys(newAnswer).forEach(key => {\n if (newAnswer[key] !== oldAnswer[key]) {\n isInteracted = true;\n }\n });\n\n return isInteracted;\n };\n\n /**\n * Handles the start of dragging an item.\n *\n * @param {Event} e the touch start or mouse down event.\n */\n DragDropOntoImageQuestion.prototype.handleDragStart = function(e) {\n var thisQ = this,\n drag = $(e.target).closest('.draghome'),\n currentIndex = this.calculateZIndex(),\n newIndex = currentIndex + 2;\n\n var info = dragDrop.prepare(e);\n if (!info.start || drag.hasClass('beingdragged')) {\n return;\n }\n\n drag.addClass('beingdragged').css('transform', '').css('z-index', newIndex);\n var currentPlace = this.getClassnameNumericSuffix(drag, 'inplace');\n if (currentPlace !== null) {\n this.setInputValue(currentPlace, 0);\n drag.removeClass('inplace' + currentPlace);\n var hiddenDrop = thisQ.getDrop(drag, currentPlace);\n if (hiddenDrop.length) {\n hiddenDrop.addClass('active');\n drag.offset(hiddenDrop.offset());\n }\n } else {\n var hiddenDrag = thisQ.getDragClone(drag);\n if (hiddenDrag.length) {\n if (drag.hasClass('infinite')) {\n var noOfDrags = this.noOfDropsInGroup(thisQ.getGroup(drag));\n var cloneDrags = this.getInfiniteDragClones(drag, false);\n if (cloneDrags.length < noOfDrags) {\n var cloneDrag = drag.clone();\n cloneDrag.removeClass('beingdragged');\n cloneDrag.removeAttr('tabindex');\n hiddenDrag.after(cloneDrag);\n questionManager.addEventHandlersToDrag(cloneDrag);\n drag.offset(cloneDrag.offset());\n } else {\n hiddenDrag.addClass('active');\n drag.offset(hiddenDrag.offset());\n }\n } else {\n hiddenDrag.addClass('active');\n drag.offset(hiddenDrag.offset());\n }\n }\n }\n\n dragDrop.start(e, drag, function(x, y, drag) {\n thisQ.dragMove(x, y, drag);\n }, function(x, y, drag) {\n thisQ.dragEnd(x, y, drag);\n });\n };\n\n /**\n * Called whenever the currently dragged items moves.\n *\n * @param {Number} pageX the x position.\n * @param {Number} pageY the y position.\n * @param {jQuery} drag the item being moved.\n */\n DragDropOntoImageQuestion.prototype.dragMove = function(pageX, pageY, drag) {\n var thisQ = this,\n highlighted = false;\n this.getRoot().find('.dropzone.group' + this.getGroup(drag)).each(function(i, dropNode) {\n var drop = $(dropNode);\n if (thisQ.isPointInDrop(pageX, pageY, drop) && !highlighted) {\n highlighted = true;\n drop.addClass('valid-drag-over-drop');\n } else {\n drop.removeClass('valid-drag-over-drop');\n }\n });\n this.getRoot().find('.draghome.placed.group' + this.getGroup(drag)).not('.beingdragged').each(function(i, dropNode) {\n var drop = $(dropNode);\n if (thisQ.isPointInDrop(pageX, pageY, drop) && !highlighted && !thisQ.isDragSameAsDrop(drag, drop)) {\n highlighted = true;\n drop.addClass('valid-drag-over-drop');\n } else {\n drop.removeClass('valid-drag-over-drop');\n }\n });\n };\n\n /**\n * Called when user drops a drag item.\n *\n * @param {Number} pageX the x position.\n * @param {Number} pageY the y position.\n * @param {jQuery} drag the item being moved.\n */\n DragDropOntoImageQuestion.prototype.dragEnd = function(pageX, pageY, drag) {\n var thisQ = this,\n root = this.getRoot(),\n placed = false;\n\n // Looking for drag that was dropped on a dropzone.\n root.find('.dropzone.group' + this.getGroup(drag)).each(function(i, dropNode) {\n var drop = $(dropNode);\n if (!thisQ.isPointInDrop(pageX, pageY, drop)) {\n // Not this drop.\n return true;\n }\n\n // Now put this drag into the drop.\n drop.removeClass('valid-drag-over-drop');\n thisQ.sendDragToDrop(drag, drop);\n placed = true;\n return false; // Stop the each() here.\n });\n\n if (!placed) {\n // Looking for drag that was dropped on a placed drag.\n root.find('.draghome.placed.group' + this.getGroup(drag)).not('.beingdragged').each(function(i, placedNode) {\n var placedDrag = $(placedNode);\n if (!thisQ.isPointInDrop(pageX, pageY, placedDrag) || thisQ.isDragSameAsDrop(drag, placedDrag)) {\n // Not this placed drag.\n return true;\n }\n\n // Now put this drag into the drop.\n placedDrag.removeClass('valid-drag-over-drop');\n var currentPlace = thisQ.getClassnameNumericSuffix(placedDrag, 'inplace');\n var drop = thisQ.getDrop(drag, currentPlace);\n thisQ.sendDragToDrop(drag, drop);\n placed = true;\n return false; // Stop the each() here.\n });\n }\n\n if (!placed) {\n this.sendDragHome(drag);\n }\n };\n\n /**\n * Animate a drag item into a given place (or back home).\n *\n * @param {jQuery|null} drag the item to place. If null, clear the place.\n * @param {jQuery} drop the place to put it.\n */\n DragDropOntoImageQuestion.prototype.sendDragToDrop = function(drag, drop) {\n // Is there already a drag in this drop? if so, evict it.\n var oldDrag = this.getCurrentDragInPlace(this.getPlace(drop));\n if (oldDrag.length !== 0) {\n oldDrag.addClass('beingdragged');\n oldDrag.offset(oldDrag.offset());\n var currentPlace = this.getClassnameNumericSuffix(oldDrag, 'inplace');\n var hiddenDrop = this.getDrop(oldDrag, currentPlace);\n hiddenDrop.addClass('active');\n this.sendDragHome(oldDrag);\n }\n\n if (drag.length === 0) {\n this.setInputValue(this.getPlace(drop), 0);\n if (drop.data('isfocus')) {\n drop.focus();\n }\n } else {\n this.setInputValue(this.getPlace(drop), this.getChoice(drag));\n drag.removeClass('unplaced')\n .addClass('placed inplace' + this.getPlace(drop));\n drag.attr('tabindex', 0);\n this.animateTo(drag, drop);\n }\n };\n\n /**\n * Animate a drag back to its home.\n *\n * @param {jQuery} drag the item being moved.\n */\n DragDropOntoImageQuestion.prototype.sendDragHome = function(drag) {\n var currentPlace = this.getClassnameNumericSuffix(drag, 'inplace');\n if (currentPlace !== null) {\n drag.removeClass('inplace' + currentPlace);\n }\n drag.data('unplaced', true);\n\n this.animateTo(drag, this.getDragHome(this.getGroup(drag), this.getChoice(drag)));\n };\n\n /**\n * Handles keyboard events on drops.\n *\n * Drops are focusable. Once focused, right/down/space switches to the next choice, and\n * left/up switches to the previous. Escape clear.\n *\n * @param {KeyboardEvent} e\n */\n DragDropOntoImageQuestion.prototype.handleKeyPress = function(e) {\n var drop = $(e.target).closest('.dropzone');\n if (drop.length === 0) {\n var placedDrag = $(e.target);\n var currentPlace = this.getClassnameNumericSuffix(placedDrag, 'inplace');\n if (currentPlace !== null) {\n drop = this.getDrop(placedDrag, currentPlace);\n }\n }\n var currentDrag = this.getCurrentDragInPlace(this.getPlace(drop)),\n nextDrag = $();\n\n switch (e.keyCode) {\n case keys.space:\n case keys.arrowRight:\n case keys.arrowDown:\n nextDrag = this.getNextDrag(this.getGroup(drop), currentDrag);\n break;\n\n case keys.arrowLeft:\n case keys.arrowUp:\n nextDrag = this.getPreviousDrag(this.getGroup(drop), currentDrag);\n break;\n\n case keys.escape:\n questionManager.isKeyboardNavigation = false;\n break;\n\n default:\n questionManager.isKeyboardNavigation = false;\n return; // To avoid the preventDefault below.\n }\n\n if (nextDrag.length) {\n nextDrag.data('isfocus', true);\n nextDrag.addClass('beingdragged');\n var hiddenDrag = this.getDragClone(nextDrag);\n if (hiddenDrag.length) {\n if (nextDrag.hasClass('infinite')) {\n var noOfDrags = this.noOfDropsInGroup(this.getGroup(nextDrag));\n var cloneDrags = this.getInfiniteDragClones(nextDrag, false);\n if (cloneDrags.length < noOfDrags) {\n var cloneDrag = nextDrag.clone();\n cloneDrag.removeClass('beingdragged');\n cloneDrag.removeAttr('tabindex');\n hiddenDrag.after(cloneDrag);\n questionManager.addEventHandlersToDrag(cloneDrag);\n nextDrag.offset(cloneDrag.offset());\n } else {\n hiddenDrag.addClass('active');\n nextDrag.offset(hiddenDrag.offset());\n }\n } else {\n hiddenDrag.addClass('active');\n nextDrag.offset(hiddenDrag.offset());\n }\n }\n } else {\n drop.data('isfocus', true);\n }\n\n e.preventDefault();\n this.sendDragToDrop(nextDrag, drop);\n };\n\n /**\n * Choose the next drag in a group.\n *\n * @param {int} group which group.\n * @param {jQuery} drag current choice (empty jQuery if there isn't one).\n * @return {jQuery} the next drag in that group, or null if there wasn't one.\n */\n DragDropOntoImageQuestion.prototype.getNextDrag = function(group, drag) {\n var choice,\n numChoices = this.noOfChoicesInGroup(group);\n\n if (drag.length === 0) {\n choice = 1; // Was empty, so we want to select the first choice.\n } else {\n choice = this.getChoice(drag) + 1;\n }\n\n var next = this.getUnplacedChoice(group, choice);\n while (next.length === 0 && choice < numChoices) {\n choice++;\n next = this.getUnplacedChoice(group, choice);\n }\n\n return next;\n };\n\n /**\n * Choose the previous drag in a group.\n *\n * @param {int} group which group.\n * @param {jQuery} drag current choice (empty jQuery if there isn't one).\n * @return {jQuery} the next drag in that group, or null if there wasn't one.\n */\n DragDropOntoImageQuestion.prototype.getPreviousDrag = function(group, drag) {\n var choice;\n\n if (drag.length === 0) {\n choice = this.noOfChoicesInGroup(group);\n } else {\n choice = this.getChoice(drag) - 1;\n }\n\n var previous = this.getUnplacedChoice(group, choice);\n while (previous.length === 0 && choice > 1) {\n choice--;\n previous = this.getUnplacedChoice(group, choice);\n }\n\n // Does this choice exist?\n return previous;\n };\n\n /**\n * Animate an object to the given destination.\n *\n * @param {jQuery} drag the element to be animated.\n * @param {jQuery} target element marking the place to move it to.\n */\n DragDropOntoImageQuestion.prototype.animateTo = function(drag, target) {\n var currentPos = drag.offset(),\n targetPos = target.offset(),\n thisQ = this;\n\n M.util.js_pending('qtype_ddimageortext-animate-' + thisQ.containerId);\n // Animate works in terms of CSS position, whereas locating an object\n // on the page works best with jQuery offset() function. So, to get\n // the right target position, we work out the required change in\n // offset() and then add that to the current CSS position.\n drag.animate(\n {\n left: parseInt(drag.css('left')) + targetPos.left - currentPos.left,\n top: parseInt(drag.css('top')) + targetPos.top - currentPos.top\n },\n {\n duration: 'fast',\n done: function() {\n $('body').trigger('qtype_ddimageortext-dragmoved', [drag, target, thisQ]);\n M.util.js_complete('qtype_ddimageortext-animate-' + thisQ.containerId);\n }\n }\n );\n };\n\n /**\n * Detect if a point is inside a given DOM node.\n *\n * @param {Number} pageX the x position.\n * @param {Number} pageY the y position.\n * @param {jQuery} drop the node to check (typically a drop).\n * @return {boolean} whether the point is inside the node.\n */\n DragDropOntoImageQuestion.prototype.isPointInDrop = function(pageX, pageY, drop) {\n var position = drop.offset();\n if (drop.hasClass('draghome')) {\n return pageX >= position.left && pageX < position.left + drop.outerWidth()\n && pageY >= position.top && pageY < position.top + drop.outerHeight();\n }\n return pageX >= position.left && pageX < position.left + drop.width()\n && pageY >= position.top && pageY < position.top + drop.height();\n };\n\n /**\n * Set the value of the hidden input for a place, to record what is currently there.\n *\n * @param {int} place which place to set the input value for.\n * @param {int} choice the value to set.\n */\n DragDropOntoImageQuestion.prototype.setInputValue = function(place, choice) {\n this.getRoot().find('input.placeinput.place' + place).val(choice);\n };\n\n /**\n * Get the outer div for this question.\n *\n * @returns {jQuery} containing that div.\n */\n DragDropOntoImageQuestion.prototype.getRoot = function() {\n return $(document.getElementById(this.containerId));\n };\n\n /**\n * Get the img that is the background image.\n * @returns {jQuery} containing that img.\n */\n DragDropOntoImageQuestion.prototype.bgImage = function() {\n return this.getRoot().find('img.dropbackground');\n };\n\n /**\n * Get drag home for a given choice.\n *\n * @param {int} group the group.\n * @param {int} choice the choice number.\n * @returns {jQuery} containing that div.\n */\n DragDropOntoImageQuestion.prototype.getDragHome = function(group, choice) {\n if (!this.getRoot().find('.draghome.dragplaceholder.group' + group + '.choice' + choice).is(':visible')) {\n return this.getRoot().find('.dragitemgroup' + group +\n ' .draghome.infinite' +\n '.choice' + choice +\n '.group' + group);\n }\n return this.getRoot().find('.draghome.dragplaceholder.group' + group + '.choice' + choice);\n };\n\n /**\n * Get an unplaced choice for a particular group.\n *\n * @param {int} group the group.\n * @param {int} choice the choice number.\n * @returns {jQuery} jQuery wrapping the unplaced choice. If there isn't one, the jQuery will be empty.\n */\n DragDropOntoImageQuestion.prototype.getUnplacedChoice = function(group, choice) {\n return this.getRoot().find('.ddarea .draghome.group' + group + '.choice' + choice + '.unplaced').slice(0, 1);\n };\n\n /**\n * Get the drag that is currently in a given place.\n *\n * @param {int} place the place number.\n * @return {jQuery} the current drag (or an empty jQuery if none).\n */\n DragDropOntoImageQuestion.prototype.getCurrentDragInPlace = function(place) {\n return this.getRoot().find('.ddarea .draghome.inplace' + place);\n };\n\n /**\n * Return the number of blanks in a given group.\n *\n * @param {int} group the group number.\n * @returns {int} the number of drops.\n */\n DragDropOntoImageQuestion.prototype.noOfDropsInGroup = function(group) {\n return this.getRoot().find('.dropzone.group' + group).length;\n };\n\n /**\n * Return the number of choices in a given group.\n *\n * @param {int} group the group number.\n * @returns {int} the number of choices.\n */\n DragDropOntoImageQuestion.prototype.noOfChoicesInGroup = function(group) {\n return this.getRoot().find('.dragitemgroup' + group + ' .draghome').length;\n };\n\n /**\n * Return the number at the end of the CSS class name with the given prefix.\n *\n * @param {jQuery} node\n * @param {String} prefix name prefix\n * @returns {Number|null} the suffix if found, else null.\n */\n DragDropOntoImageQuestion.prototype.getClassnameNumericSuffix = function(node, prefix) {\n var classes = node.attr('class');\n if (classes !== '') {\n var classesArr = classes.split(' ');\n for (var index = 0; index < classesArr.length; index++) {\n var patt1 = new RegExp('^' + prefix + '([0-9])+$');\n if (patt1.test(classesArr[index])) {\n var patt2 = new RegExp('([0-9])+$');\n var match = patt2.exec(classesArr[index]);\n return Number(match[0]);\n }\n }\n }\n return null;\n };\n\n /**\n * Get the choice number of a drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {Number} the choice number.\n */\n DragDropOntoImageQuestion.prototype.getChoice = function(drag) {\n return this.getClassnameNumericSuffix(drag, 'choice');\n };\n\n /**\n * Given a DOM node that is significant to this question\n * (drag, drop, ...) get the group it belongs to.\n *\n * @param {jQuery} node a DOM node.\n * @returns {Number} the group it belongs to.\n */\n DragDropOntoImageQuestion.prototype.getGroup = function(node) {\n return this.getClassnameNumericSuffix(node, 'group');\n };\n\n /**\n * Get the place number of a drop, or its corresponding hidden input.\n *\n * @param {jQuery} node the DOM node.\n * @returns {Number} the place number.\n */\n DragDropOntoImageQuestion.prototype.getPlace = function(node) {\n return this.getClassnameNumericSuffix(node, 'place');\n };\n\n /**\n * Get drag clone for a given drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {jQuery} the drag's clone.\n */\n DragDropOntoImageQuestion.prototype.getDragClone = function(drag) {\n return this.getRoot().find('.dragitemgroup' +\n this.getGroup(drag) +\n ' .draghome' +\n '.choice' + this.getChoice(drag) +\n '.group' + this.getGroup(drag) +\n '.dragplaceholder');\n };\n\n /**\n * Get infinite drag clones for given drag.\n *\n * @param {jQuery} drag the drag.\n * @param {Boolean} inHome in the home area or not.\n * @returns {jQuery} the drag's clones.\n */\n DragDropOntoImageQuestion.prototype.getInfiniteDragClones = function(drag, inHome) {\n if (inHome) {\n return this.getRoot().find('.dragitemgroup' +\n this.getGroup(drag) +\n ' .draghome' +\n '.choice' + this.getChoice(drag) +\n '.group' + this.getGroup(drag) +\n '.infinite').not('.dragplaceholder');\n }\n return this.getRoot().find('.draghome' +\n '.choice' + this.getChoice(drag) +\n '.group' + this.getGroup(drag) +\n '.infinite').not('.dragplaceholder');\n };\n\n /**\n * Get drop for a given drag and place.\n *\n * @param {jQuery} drag the drag.\n * @param {Integer} currentPlace the current place of drag.\n * @returns {jQuery} the drop's clone.\n */\n DragDropOntoImageQuestion.prototype.getDrop = function(drag, currentPlace) {\n return this.getRoot().find('.dropzone.group' + this.getGroup(drag) + '.place' + currentPlace);\n };\n\n /**\n * Handle when the window is resized.\n */\n DragDropOntoImageQuestion.prototype.handleResize = function() {\n var thisQ = this,\n bgRatio = this.bgRatio();\n if (this.isPrinting) {\n bgRatio = 1;\n }\n\n this.getRoot().find('.ddarea .dropzone').each(function(i, dropNode) {\n $(dropNode)\n .css('left', parseInt($(dropNode).data('originX')) * parseFloat(bgRatio))\n .css('top', parseInt($(dropNode).data('originY')) * parseFloat(bgRatio));\n thisQ.handleElementScale(dropNode, 'left top');\n });\n\n this.getRoot().find('div.droparea .draghome').not('.beingdragged').each(function(key, drag) {\n $(drag)\n .css('left', parseFloat($(drag).data('originX')) * parseFloat(bgRatio))\n .css('top', parseFloat($(drag).data('originY')) * parseFloat(bgRatio));\n thisQ.handleElementScale(drag, 'left top');\n });\n };\n\n /**\n * Return the background ratio.\n *\n * @returns {number} Background ratio.\n */\n DragDropOntoImageQuestion.prototype.bgRatio = function() {\n var bgImg = this.bgImage();\n var bgImgNaturalWidth = bgImg.get(0).naturalWidth;\n var bgImgClientWidth = bgImg.width();\n\n return bgImgClientWidth / bgImgNaturalWidth;\n };\n\n /**\n * Scale the drag if needed.\n *\n * @param {jQuery} element the item to place.\n * @param {String} type scaling type\n */\n DragDropOntoImageQuestion.prototype.handleElementScale = function(element, type) {\n var bgRatio = parseFloat(this.bgRatio());\n if (this.isPrinting) {\n bgRatio = 1;\n }\n $(element).css({\n '-webkit-transform': 'scale(' + bgRatio + ')',\n '-moz-transform': 'scale(' + bgRatio + ')',\n '-ms-transform': 'scale(' + bgRatio + ')',\n '-o-transform': 'scale(' + bgRatio + ')',\n 'transform': 'scale(' + bgRatio + ')',\n 'transform-origin': type\n });\n };\n\n /**\n * Calculate z-index value.\n *\n * @returns {number} z-index value\n */\n DragDropOntoImageQuestion.prototype.calculateZIndex = function() {\n var zIndex = 0;\n this.getRoot().find('.ddarea .dropzone, div.droparea .draghome').each(function(i, dropNode) {\n dropNode = $(dropNode);\n // Note that webkit browsers won't return the z-index value from the CSS stylesheet\n // if the element doesn't have a position specified. Instead it'll return \"auto\".\n var itemZIndex = dropNode.css('z-index') ? parseInt(dropNode.css('z-index')) : 0;\n\n if (itemZIndex > zIndex) {\n zIndex = itemZIndex;\n }\n });\n\n return zIndex;\n };\n\n /**\n * Check that the drag is drop to it's clone.\n *\n * @param {jQuery} drag The drag.\n * @param {jQuery} drop The drop.\n * @returns {boolean}\n */\n DragDropOntoImageQuestion.prototype.isDragSameAsDrop = function(drag, drop) {\n return this.getChoice(drag) === this.getChoice(drop) && this.getGroup(drag) === this.getGroup(drop);\n };\n\n /**\n * Singleton object that handles all the DragDropOntoImageQuestions\n * on the page, and deals with event dispatching.\n * @type {Object}\n */\n var questionManager = {\n\n /**\n * {boolean} ensures that the event handlers are only initialised once per page.\n */\n eventHandlersInitialised: false,\n\n /**\n * {Object} ensures that the drag event handlers are only initialised once per question,\n * indexed by containerId (id on the .que div).\n */\n dragEventHandlersInitialised: {},\n\n /**\n * {boolean} is printing or not.\n */\n isPrinting: false,\n\n /**\n * {boolean} is keyboard navigation or not.\n */\n isKeyboardNavigation: false,\n\n /**\n * {Object} all the questions on this page, indexed by containerId (id on the .que div).\n */\n questions: {}, // An object containing all the information about each question on the page.\n\n /**\n * Initialise one question.\n *\n * @method\n * @param {String} containerId the id of the div.que that contains this question.\n * @param {boolean} readOnly whether the question is read-only.\n */\n init: function(containerId, readOnly) {\n const places = JSON.parse(document.querySelector('#' + containerId + ' .dropzones').dataset.placeInfo);\n questionManager.questions[containerId] =\n new DragDropOntoImageQuestion(containerId, readOnly, places);\n if (!questionManager.eventHandlersInitialised) {\n questionManager.setupEventHandlers();\n questionManager.eventHandlersInitialised = true;\n }\n if (!questionManager.dragEventHandlersInitialised.hasOwnProperty(containerId)) {\n questionManager.dragEventHandlersInitialised[containerId] = true;\n // We do not use the body event here to prevent the other event on Mobile device, such as scroll event.\n var questionContainer = document.getElementById(containerId);\n if (questionContainer.classList.contains('ddimageortext') &&\n !questionContainer.classList.contains('qtype_ddimageortext-readonly')) {\n // TODO: Convert all the jQuery selectors and events to native Javascript.\n questionManager.addEventHandlersToDrag($(questionContainer).find('.draghome'));\n }\n }\n },\n\n /**\n * Set up the event handlers that make this question type work. (Done once per page.)\n */\n setupEventHandlers: function() {\n $('body')\n .on('keydown',\n '.que.ddimageortext:not(.qtype_ddimageortext-readonly) .dropzones .dropzone',\n questionManager.handleKeyPress)\n .on('keydown',\n '.que.ddimageortext:not(.qtype_ddimageortext-readonly) .draghome.placed:not(.beingdragged)',\n questionManager.handleKeyPress)\n .on('qtype_ddimageortext-dragmoved', questionManager.handleDragMoved);\n $(window).on('resize', function() {\n questionManager.handleWindowResize(false);\n });\n window.addEventListener('beforeprint', function() {\n questionManager.isPrinting = true;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n window.addEventListener('afterprint', function() {\n questionManager.isPrinting = false;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved();\n }, 100);\n },\n\n /**\n * Binding the drag/touch event again for newly created element.\n *\n * @param {jQuery} element Element to bind the event\n */\n addEventHandlersToDrag: function(element) {\n // Unbind all the mousedown and touchstart events to prevent double binding.\n element.unbind('mousedown touchstart');\n element.on('mousedown touchstart', questionManager.handleDragStart);\n },\n\n /**\n * Handle mouse down / touch start events on drags.\n * @param {Event} e the DOM event.\n */\n handleDragStart: function(e) {\n e.preventDefault();\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleDragStart(e);\n }\n },\n\n /**\n * Handle key down / press events on drags.\n * @param {KeyboardEvent} e\n */\n handleKeyPress: function(e) {\n if (questionManager.isKeyboardNavigation) {\n return;\n }\n questionManager.isKeyboardNavigation = true;\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleKeyPress(e);\n }\n },\n\n /**\n * Handle when the window is resized.\n * @param {boolean} isPrinting\n */\n handleWindowResize: function(isPrinting) {\n for (var containerId in questionManager.questions) {\n if (questionManager.questions.hasOwnProperty(containerId)) {\n questionManager.questions[containerId].isPrinting = isPrinting;\n questionManager.questions[containerId].handleResize();\n }\n }\n },\n\n /**\n * Sometimes, despite our best efforts, things change in a way that cannot\n * be specifically caught (e.g. dock expanding or collapsing in Boost).\n * Therefore, we need to periodically check everything is in the right position.\n */\n fixLayoutIfThingsMoved: function() {\n this.handleWindowResize(questionManager.isPrinting);\n // We use setTimeout after finishing work, rather than setInterval,\n // in case positioning things is slow. We want 100 ms gap\n // between executions, not what setInterval does.\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting);\n }, 100);\n },\n\n /**\n * Handle when drag moved.\n *\n * @param {Event} e the event.\n * @param {jQuery} drag the drag\n * @param {jQuery} target the target\n * @param {DragDropOntoImageQuestion} thisQ the question.\n */\n handleDragMoved: function(e, drag, target, thisQ) {\n drag.removeClass('beingdragged').css('z-index', '');\n drag.css('top', target.position().top).css('left', target.position().left);\n target.after(drag);\n target.removeClass('active');\n if (typeof drag.data('unplaced') !== 'undefined' && drag.data('unplaced') === true) {\n drag.removeClass('placed').addClass('unplaced');\n drag.removeAttr('tabindex');\n drag.removeData('unplaced');\n drag.css('top', '')\n .css('left', '')\n .css('transform', '');\n if (drag.hasClass('infinite') && thisQ.getInfiniteDragClones(drag, true).length > 1) {\n thisQ.getInfiniteDragClones(drag, true).first().remove();\n }\n } else {\n drag.data('originX', target.data('originX')).data('originY', target.data('originY'));\n thisQ.handleElementScale(drag, 'left top');\n }\n if (typeof drag.data('isfocus') !== 'undefined' && drag.data('isfocus') === true) {\n drag.focus();\n drag.removeData('isfocus');\n }\n if (typeof target.data('isfocus') !== 'undefined' && target.data('isfocus') === true) {\n target.removeData('isfocus');\n }\n if (questionManager.isKeyboardNavigation) {\n questionManager.isKeyboardNavigation = false;\n }\n if (thisQ.isQuestionInteracted()) {\n // The user has interacted with the draggable items. We need to mark the form as dirty.\n questionManager.handleFormDirty();\n // Save the new answered value.\n thisQ.questionAnswer = thisQ.getQuestionAnsweredValues();\n }\n },\n\n /**\n * Given an event, work out which question it effects.\n * @param {Event} e the event.\n * @returns {DragDropOntoImageQuestion|undefined} The question, or undefined.\n */\n getQuestionForEvent: function(e) {\n var containerId = $(e.currentTarget).closest('.que.ddimageortext').attr('id');\n return questionManager.questions[containerId];\n },\n\n /**\n * Handle when the form is dirty.\n */\n handleFormDirty: function() {\n const responseForm = document.getElementById('responseform');\n FormChangeChecker.markFormAsDirty(responseForm);\n }\n };\n\n /**\n * @alias module:qtype_ddimageortext/question\n */\n return {\n init: questionManager.init\n };\n});\n"],"names":["define","$","dragDrop","keys","FormChangeChecker","filterEvent","DragDropOntoImageQuestion","containerId","readOnly","places","questionAnswer","questionDragDropWidthHeight","M","util","js_pending","this","allImagesLoaded","imageLoadingTimeoutId","isPrinting","getRoot","addClass","thisQ","getNotYetLoadedImages","one","waitForAllImagesToBeLoaded","prototype","changeAllDragsAndDropsToFilteredContent","filteredElement","currentFilteredItem","parentIsDD","parent","closest","hasClass","isDD","find","length","group","getGroup","choice","getChoice","listOfModifiedDragDrop","each","i","node","get","originalClass","attr","originalStyle","filteredDragDropClone","clone","questionManager","addEventHandlersToDrag","before","push","forEach","remove","currentHeight","height","currentWidth","width","offsetWidth","offsetHeight","classList","add","maxWidth","Math","ceil","maxHeight","resizeAllDragsAndDropsInGroup","top","floor","css","clearTimeout","setTimeout","setupQuestion","document","addEventListener","eventTypes","filterContentRenderingComplete","elements","detail","nodes","element","not","imgNode","imageIsLoaded","imgElement","complete","naturalHeight","resizeAllDragsAndDrops","cloneDrags","positionDragsAndDrops","js_complete","getClassnameNumericSuffix","root","dragHomes","drag","max","hasOwnProperty","place","label","text","parseInt","get_string","append","index","dragHome","placeHolder","removeClass","cloneDragsForOneChoice","noOfDrags","noOfDropsInGroup","cloneDrag","offset","bgRatio","dropNode","drop","getPlace","xy","data","handleElementScale","dragNode","currentPlace","removeAttr","inputNode","input","val","unplacedDrag","getUnplacedChoice","hiddenDrag","getDragClone","getInfiniteDragClones","after","sendDragToDrop","getQuestionAnsweredValues","result","id","value","isQuestionInteracted","oldAnswer","newAnswer","isInteracted","JSON","stringify","Object","key","handleDragStart","e","target","newIndex","calculateZIndex","prepare","start","setInputValue","hiddenDrop","getDrop","x","y","dragMove","dragEnd","pageX","pageY","highlighted","isPointInDrop","isDragSameAsDrop","placed","placedNode","placedDrag","sendDragHome","oldDrag","getCurrentDragInPlace","focus","animateTo","getDragHome","handleKeyPress","currentDrag","nextDrag","keyCode","space","arrowRight","arrowDown","getNextDrag","arrowLeft","arrowUp","getPreviousDrag","escape","isKeyboardNavigation","preventDefault","numChoices","noOfChoicesInGroup","next","previous","currentPos","targetPos","animate","left","duration","done","trigger","position","outerWidth","outerHeight","getElementById","bgImage","is","slice","prefix","classes","classesArr","split","RegExp","test","match","exec","Number","inHome","handleResize","parseFloat","bgImg","bgImgNaturalWidth","naturalWidth","type","zIndex","itemZIndex","eventHandlersInitialised","dragEventHandlersInitialised","questions","init","parse","querySelector","dataset","placeInfo","setupEventHandlers","questionContainer","contains","on","handleDragMoved","window","handleWindowResize","fixLayoutIfThingsMoved","unbind","question","getQuestionForEvent","removeData","first","handleFormDirty","currentTarget","responseForm","markFormAsDirty"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"question.min.js","sources":["../src/question.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/*\n * JavaScript to allow dragging options to slots (using mouse down or touch) or tab through slots using keyboard.\n *\n * @module qtype_ddimageortext/question\n * @copyright 2018 The Open University\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\ndefine([\n 'jquery',\n 'core/dragdrop',\n 'core/key_codes',\n 'core_form/changechecker',\n 'core_filters/events',\n], function(\n $,\n dragDrop,\n keys,\n FormChangeChecker,\n filterEvent\n) {\n\n \"use strict\";\n\n /**\n * Initialise one drag-drop onto image question.\n *\n * @param {String} containerId id of the outer div for this question.\n * @param {boolean} readOnly whether the question is being displayed read-only.\n * @param {Array} places Information about the drop places.\n * @constructor\n */\n function DragDropOntoImageQuestion(containerId, readOnly, places) {\n this.containerId = containerId;\n this.questionAnswer = {};\n this.questionDragDropWidthHeight = [];\n M.util.js_pending('qtype_ddimageortext-init-' + this.containerId);\n this.places = places;\n this.allImagesLoaded = false;\n this.imageLoadingTimeoutId = null;\n this.isPrinting = false;\n if (readOnly) {\n this.getRoot().addClass('qtype_ddimageortext-readonly');\n }\n\n var thisQ = this;\n this.getNotYetLoadedImages().one('load', function() {\n thisQ.waitForAllImagesToBeLoaded();\n });\n this.waitForAllImagesToBeLoaded();\n }\n\n /**\n * Change all the drags and drops related to the item that has been changed by filter to correct size and content.\n *\n * @param {object} filteredElement the element has been modified by filter.\n */\n DragDropOntoImageQuestion.prototype.changeAllDragsAndDropsToFilteredContent = function(filteredElement) {\n let currentFilteredItem = $(filteredElement);\n const parentIsDD = currentFilteredItem.parent().closest('div').hasClass('placed') ||\n currentFilteredItem.parent().hasClass('draghome');\n const isDD = currentFilteredItem.hasClass('placed') || currentFilteredItem.hasClass('draghome');\n // The filtered element or parent element should a drag or drop item.\n if (!parentIsDD && !isDD) {\n return;\n }\n if (parentIsDD) {\n currentFilteredItem = currentFilteredItem.parent().closest('div');\n }\n if (this.getRoot().find(currentFilteredItem).length <= 0) {\n // If the DD item doesn't belong to this question\n // In case we have multiple questions in the same page.\n return;\n }\n const group = this.getGroup(currentFilteredItem),\n choice = this.getChoice(currentFilteredItem);\n let listOfModifiedDragDrop = [];\n // Get the list of drag and drop item within the same group and choice.\n this.getRoot().find('.group' + group + '.choice' + choice).each(function(i, node) {\n // Same modified item, skip it.\n if ($(node).get(0) === currentFilteredItem.get(0)) {\n return;\n }\n const originalClass = $(node).attr('class');\n const originalStyle = $(node).attr('style');\n // We want to keep all the handler and event for filtered item, so using clone is the only choice.\n const filteredDragDropClone = currentFilteredItem.clone();\n // Sometimes, for the question that has a lot of input groups and unlimited draggable items,\n // this 'clone' process takes longer than usual,it will not add the eventHandler for this cloned drag.\n // We need to make sure to add the eventHandler for the cloned drag too.\n questionManager.addEventHandlersToDrag(filteredDragDropClone);\n // Replace the class and style of the drag drop item we want to replace for the clone.\n filteredDragDropClone.attr('class', originalClass);\n filteredDragDropClone.attr('style', originalStyle);\n // Insert into DOM.\n $(node).before(filteredDragDropClone);\n // Add the item has been replaced to a list so we can remove it later.\n listOfModifiedDragDrop.push(node);\n });\n\n listOfModifiedDragDrop.forEach(function(node) {\n $(node).remove();\n });\n // Save the current height and width.\n const currentHeight = currentFilteredItem.height();\n const currentWidth = currentFilteredItem.width();\n // Set to auto, so we can get the real height and width of the filtered item.\n currentFilteredItem.height('auto');\n currentFilteredItem.width('auto');\n // We need to set display block so we can get height and width.\n // Some browsers can't get the offsetWidth/Height if they are an inline element like span tag.\n if (!filteredElement.offsetWidth || !filteredElement.offsetHeight) {\n filteredElement.classList.add('d-block');\n }\n if (this.questionDragDropWidthHeight[group].maxWidth < Math.ceil(filteredElement.offsetWidth) ||\n this.questionDragDropWidthHeight[group].maxHeight < Math.ceil(0 + filteredElement.offsetHeight)) {\n // Remove the d-block class before calculation.\n filteredElement.classList.remove('d-block');\n // Now resize all the items in the same group if we have new maximum width or height.\n this.resizeAllDragsAndDropsInGroup(group);\n } else {\n // Calculate the top padding.\n const top = Math.floor((this.questionDragDropWidthHeight[group].maxHeight - filteredElement.offsetHeight) / 2);\n // Set top padding so the content of filtered item is center again.\n currentFilteredItem.width(currentWidth).height(currentHeight).css({\n 'padding-top': top + 'px',\n });\n }\n // Remove the d-block class after resize.\n filteredElement.classList.remove('d-block');\n };\n\n /**\n * Waits until all images are loaded before calling setupQuestion().\n *\n * This function is called from the onLoad of each image, and also polls with\n * a time-out, because image on-loads are allegedly unreliable.\n */\n DragDropOntoImageQuestion.prototype.waitForAllImagesToBeLoaded = function() {\n var thisQ = this;\n\n // This method may get called multiple times (via image on-loads or timeouts.\n // If we are already done, don't do it again.\n if (this.allImagesLoaded) {\n return;\n }\n\n // Clear any current timeout, if set.\n if (this.imageLoadingTimeoutId !== null) {\n clearTimeout(this.imageLoadingTimeoutId);\n }\n\n // If we have not yet loaded all images, set a timeout to\n // call ourselves again, since apparently images on-load\n // events are flakey.\n if (this.getNotYetLoadedImages().length > 0) {\n this.imageLoadingTimeoutId = setTimeout(function() {\n thisQ.waitForAllImagesToBeLoaded();\n }, 100);\n return;\n }\n\n // We now have all images. Carry on, but only after giving the layout a chance to settle down.\n this.allImagesLoaded = true;\n thisQ.setupQuestion();\n // Wait for all dynamic content loaded by filter to be completed.\n document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete, (elements) => {\n elements.detail.nodes.forEach((element) => {\n thisQ.changeAllDragsAndDropsToFilteredContent(element);\n });\n });\n };\n\n /**\n * Get any of the images in the drag-drop area that are not yet fully loaded.\n *\n * @returns {jQuery} those images.\n */\n DragDropOntoImageQuestion.prototype.getNotYetLoadedImages = function() {\n var thisQ = this;\n return this.getRoot().find('.ddarea img').not(function(i, imgNode) {\n return thisQ.imageIsLoaded(imgNode);\n });\n };\n\n /**\n * Check if an image has loaded without errors.\n *\n * @param {HTMLImageElement} imgElement an image.\n * @returns {boolean} true if this image has loaded without errors.\n */\n DragDropOntoImageQuestion.prototype.imageIsLoaded = function(imgElement) {\n return imgElement.complete && imgElement.naturalHeight !== 0;\n };\n\n /**\n * Set up the question, once all images have been loaded.\n */\n DragDropOntoImageQuestion.prototype.setupQuestion = function() {\n this.resizeAllDragsAndDrops();\n this.cloneDrags();\n this.positionDragsAndDrops();\n M.util.js_complete('qtype_ddimageortext-init-' + this.containerId);\n };\n\n /**\n * In each group, resize all the items to be the same size.\n */\n DragDropOntoImageQuestion.prototype.resizeAllDragsAndDrops = function() {\n var thisQ = this;\n this.getRoot().find('.draghomes > div').each(function(i, node) {\n thisQ.resizeAllDragsAndDropsInGroup(\n thisQ.getClassnameNumericSuffix($(node), 'dragitemgroup'));\n });\n };\n\n /**\n * In a given group, set all the drags and drops to be the same size.\n *\n * @param {int} group the group number.\n */\n DragDropOntoImageQuestion.prototype.resizeAllDragsAndDropsInGroup = function(group) {\n var root = this.getRoot(),\n dragHomes = root.find(\".draghome.group\" + group),\n maxWidth = 0,\n maxHeight = 0;\n\n // Find the maximum size of any drag in this groups.\n dragHomes.each(function(i, drag) {\n maxWidth = Math.max(maxWidth, Math.ceil(drag.offsetWidth));\n maxHeight = Math.max(maxHeight, Math.ceil(drag.offsetHeight));\n });\n\n // The size we will want to set is a bit bigger than this.\n maxWidth += 10;\n maxHeight += 10;\n this.questionDragDropWidthHeight[group] = {maxWidth, maxHeight};\n\n // Set each drag home to that size.\n dragHomes.each(function(i, drag) {\n const top = Math.floor((maxHeight - drag.offsetHeight) / 2);\n // Set top padding so the item is centred.\n $(drag).width(maxWidth).height(maxHeight).css({\n 'padding-top': top + 'px',\n });\n });\n\n // Create the drops and make them the right size.\n for (var i in this.places) {\n if (!this.places.hasOwnProperty((i))) {\n continue;\n }\n var place = this.places[i],\n label = place.text;\n if (parseInt(place.group) !== group) {\n continue;\n }\n if (label === '') {\n label = M.util.get_string('blank', 'qtype_ddimageortext');\n }\n if (root.find('.dropzones .dropzone.group' + place.group + '.place' + i).length === 0) {\n root.find('.dropzones').append('
' +\n '' + label + ' 
');\n }\n root.find('.dropzone.place' + i).width(maxWidth - 2).height(maxHeight - 2);\n }\n };\n\n /**\n * Invisible 'drag homes' are output by the renderer. These have the same properties\n * as the drag items but are invisible. We clone these invisible elements to make the\n * actual drag items.\n */\n DragDropOntoImageQuestion.prototype.cloneDrags = function() {\n var thisQ = this;\n thisQ.getRoot().find('.draghome').each(function(index, dragHome) {\n var drag = $(dragHome);\n var placeHolder = drag.clone();\n placeHolder.removeClass();\n placeHolder.addClass('draghome choice' +\n thisQ.getChoice(drag) + ' group' +\n thisQ.getGroup(drag) + ' dragplaceholder');\n drag.before(placeHolder);\n });\n };\n\n /**\n * Clone drag item for one choice.\n *\n * @param {jQuery} dragHome the drag home to clone.\n */\n DragDropOntoImageQuestion.prototype.cloneDragsForOneChoice = function(dragHome) {\n if (dragHome.hasClass('infinite')) {\n var noOfDrags = this.noOfDropsInGroup(this.getGroup(dragHome));\n for (var i = 0; i < noOfDrags; i++) {\n this.cloneDrag(dragHome);\n }\n } else {\n this.cloneDrag(dragHome);\n }\n };\n\n /**\n * Clone drag item.\n *\n * @param {jQuery} dragHome\n */\n DragDropOntoImageQuestion.prototype.cloneDrag = function(dragHome) {\n var drag = dragHome.clone();\n drag.removeClass('draghome')\n .addClass('drag unplaced moodle-has-zindex')\n .offset(dragHome.offset());\n this.getRoot().find('.dragitems').append(drag);\n };\n\n /**\n * Update the position of drags.\n */\n DragDropOntoImageQuestion.prototype.positionDragsAndDrops = function() {\n var thisQ = this,\n root = this.getRoot(),\n bgRatio = this.bgRatio();\n\n // Move the drops into position.\n root.find('.ddarea .dropzone').each(function(i, dropNode) {\n var drop = $(dropNode),\n place = thisQ.places[thisQ.getPlace(drop)];\n // The xy values come from PHP as strings, so we need parseInt to stop JS doing string concatenation.\n drop.css('left', parseInt(place.xy[0]) * bgRatio)\n .css('top', parseInt(place.xy[1]) * bgRatio);\n drop.data('originX', parseInt(place.xy[0]))\n .data('originY', parseInt(place.xy[1]));\n thisQ.handleElementScale(drop, 'left top');\n });\n\n // First move all items back home.\n root.find('.draghome').not('.dragplaceholder').each(function(i, dragNode) {\n var drag = $(dragNode),\n currentPlace = thisQ.getClassnameNumericSuffix(drag, 'inplace');\n drag.addClass('unplaced')\n .removeClass('placed');\n drag.removeAttr('tabindex');\n if (currentPlace !== null) {\n drag.removeClass('inplace' + currentPlace);\n }\n });\n\n // Then place the ones that should be placed.\n root.find('input.placeinput').each(function(i, inputNode) {\n var input = $(inputNode),\n choice = input.val();\n if (choice.length === 0 || (choice.length > 0 && choice === '0')) {\n // No item in this place.\n return;\n }\n\n var place = thisQ.getPlace(input);\n // Get the unplaced drag.\n var unplacedDrag = thisQ.getUnplacedChoice(thisQ.getGroup(input), choice);\n // Get the clone of the drag.\n var hiddenDrag = thisQ.getDragClone(unplacedDrag);\n if (hiddenDrag.length) {\n if (unplacedDrag.hasClass('infinite')) {\n var noOfDrags = thisQ.noOfDropsInGroup(thisQ.getGroup(unplacedDrag));\n var cloneDrags = thisQ.getInfiniteDragClones(unplacedDrag, false);\n if (cloneDrags.length < noOfDrags) {\n var cloneDrag = unplacedDrag.clone();\n cloneDrag.removeClass('beingdragged');\n cloneDrag.removeAttr('tabindex');\n hiddenDrag.after(cloneDrag);\n // Sometimes, for the question that has a lot of input groups and unlimited draggable items,\n // this 'clone' process takes longer than usual, so the questionManager.init() method\n // will not add the eventHandler for this cloned drag.\n // We need to make sure to add the eventHandler for the cloned drag too.\n questionManager.addEventHandlersToDrag(cloneDrag);\n } else {\n hiddenDrag.addClass('active');\n }\n } else {\n hiddenDrag.addClass('active');\n }\n }\n\n // Send the drag to drop.\n var drop = root.find('.dropzone.place' + place);\n thisQ.sendDragToDrop(unplacedDrag, drop);\n });\n\n // Save the question answer.\n thisQ.questionAnswer = thisQ.getQuestionAnsweredValues();\n };\n\n /**\n * Get the question answered values.\n *\n * @return {Object} Contain key-value with key is the input id and value is the input value.\n */\n DragDropOntoImageQuestion.prototype.getQuestionAnsweredValues = function() {\n let result = {};\n this.getRoot().find('input.placeinput').each((i, inputNode) => {\n result[inputNode.id] = inputNode.value;\n });\n\n return result;\n };\n\n /**\n * Check if the question is being interacted or not.\n *\n * @return {boolean} Return true if the user has changed the question-answer.\n */\n DragDropOntoImageQuestion.prototype.isQuestionInteracted = function() {\n const oldAnswer = this.questionAnswer;\n const newAnswer = this.getQuestionAnsweredValues();\n let isInteracted = false;\n\n // First, check both answers have the same structure or not.\n if (JSON.stringify(newAnswer) !== JSON.stringify(oldAnswer)) {\n isInteracted = true;\n return isInteracted;\n }\n // Check the values.\n Object.keys(newAnswer).forEach(key => {\n if (newAnswer[key] !== oldAnswer[key]) {\n isInteracted = true;\n }\n });\n\n return isInteracted;\n };\n\n /**\n * Handles the start of dragging an item.\n *\n * @param {Event} e the touch start or mouse down event.\n */\n DragDropOntoImageQuestion.prototype.handleDragStart = function(e) {\n var thisQ = this,\n drag = $(e.target).closest('.draghome'),\n currentIndex = this.calculateZIndex(),\n newIndex = currentIndex + 2;\n\n var info = dragDrop.prepare(e);\n if (!info.start || drag.hasClass('beingdragged')) {\n return;\n }\n\n drag.addClass('beingdragged').css('transform', '').css('z-index', newIndex);\n var currentPlace = this.getClassnameNumericSuffix(drag, 'inplace');\n if (currentPlace !== null) {\n this.setInputValue(currentPlace, 0);\n drag.removeClass('inplace' + currentPlace);\n var hiddenDrop = thisQ.getDrop(drag, currentPlace);\n if (hiddenDrop.length) {\n hiddenDrop.addClass('active');\n drag.offset(hiddenDrop.offset());\n }\n } else {\n var hiddenDrag = thisQ.getDragClone(drag);\n if (hiddenDrag.length) {\n if (drag.hasClass('infinite')) {\n var noOfDrags = this.noOfDropsInGroup(thisQ.getGroup(drag));\n var cloneDrags = this.getInfiniteDragClones(drag, false);\n if (cloneDrags.length < noOfDrags) {\n var cloneDrag = drag.clone();\n cloneDrag.removeClass('beingdragged');\n cloneDrag.removeAttr('tabindex');\n hiddenDrag.after(cloneDrag);\n questionManager.addEventHandlersToDrag(cloneDrag);\n drag.offset(cloneDrag.offset());\n } else {\n hiddenDrag.addClass('active');\n drag.offset(hiddenDrag.offset());\n }\n } else {\n hiddenDrag.addClass('active');\n drag.offset(hiddenDrag.offset());\n }\n }\n }\n\n dragDrop.start(e, drag, function(x, y, drag) {\n thisQ.dragMove(x, y, drag);\n }, function(x, y, drag) {\n thisQ.dragEnd(x, y, drag);\n });\n };\n\n /**\n * Called whenever the currently dragged items moves.\n *\n * @param {Number} pageX the x position.\n * @param {Number} pageY the y position.\n * @param {jQuery} drag the item being moved.\n */\n DragDropOntoImageQuestion.prototype.dragMove = function(pageX, pageY, drag) {\n var thisQ = this,\n highlighted = false;\n this.getRoot().find('.dropzone.group' + this.getGroup(drag)).each(function(i, dropNode) {\n var drop = $(dropNode);\n if (thisQ.isPointInDrop(pageX, pageY, drop) && !highlighted) {\n highlighted = true;\n drop.addClass('valid-drag-over-drop');\n } else {\n drop.removeClass('valid-drag-over-drop');\n }\n });\n this.getRoot().find('.draghome.placed.group' + this.getGroup(drag)).not('.beingdragged').each(function(i, dropNode) {\n var drop = $(dropNode);\n if (thisQ.isPointInDrop(pageX, pageY, drop) && !highlighted && !thisQ.isDragSameAsDrop(drag, drop)) {\n highlighted = true;\n drop.addClass('valid-drag-over-drop');\n } else {\n drop.removeClass('valid-drag-over-drop');\n }\n });\n };\n\n /**\n * Called when user drops a drag item.\n *\n * @param {Number} pageX the x position.\n * @param {Number} pageY the y position.\n * @param {jQuery} drag the item being moved.\n */\n DragDropOntoImageQuestion.prototype.dragEnd = function(pageX, pageY, drag) {\n var thisQ = this,\n root = this.getRoot(),\n placed = false;\n\n // Looking for drag that was dropped on a dropzone.\n root.find('.dropzone.group' + this.getGroup(drag)).each(function(i, dropNode) {\n var drop = $(dropNode);\n if (!thisQ.isPointInDrop(pageX, pageY, drop)) {\n // Not this drop.\n return true;\n }\n\n // Now put this drag into the drop.\n drop.removeClass('valid-drag-over-drop');\n thisQ.sendDragToDrop(drag, drop);\n placed = true;\n return false; // Stop the each() here.\n });\n\n if (!placed) {\n // Looking for drag that was dropped on a placed drag.\n root.find('.draghome.placed.group' + this.getGroup(drag)).not('.beingdragged').each(function(i, placedNode) {\n var placedDrag = $(placedNode);\n if (!thisQ.isPointInDrop(pageX, pageY, placedDrag) || thisQ.isDragSameAsDrop(drag, placedDrag)) {\n // Not this placed drag.\n return true;\n }\n\n // Now put this drag into the drop.\n placedDrag.removeClass('valid-drag-over-drop');\n var currentPlace = thisQ.getClassnameNumericSuffix(placedDrag, 'inplace');\n var drop = thisQ.getDrop(drag, currentPlace);\n thisQ.sendDragToDrop(drag, drop);\n placed = true;\n return false; // Stop the each() here.\n });\n }\n\n if (!placed) {\n this.sendDragHome(drag);\n }\n };\n\n /**\n * Animate a drag item into a given place (or back home).\n *\n * @param {jQuery|null} drag the item to place. If null, clear the place.\n * @param {jQuery} drop the place to put it.\n */\n DragDropOntoImageQuestion.prototype.sendDragToDrop = function(drag, drop) {\n // Is there already a drag in this drop? if so, evict it.\n var oldDrag = this.getCurrentDragInPlace(this.getPlace(drop));\n if (oldDrag.length !== 0) {\n oldDrag.addClass('beingdragged');\n oldDrag.offset(oldDrag.offset());\n var currentPlace = this.getClassnameNumericSuffix(oldDrag, 'inplace');\n var hiddenDrop = this.getDrop(oldDrag, currentPlace);\n hiddenDrop.addClass('active');\n this.sendDragHome(oldDrag);\n }\n\n if (drag.length === 0) {\n this.setInputValue(this.getPlace(drop), 0);\n if (drop.data('isfocus')) {\n drop.focus();\n }\n } else {\n this.setInputValue(this.getPlace(drop), this.getChoice(drag));\n drag.removeClass('unplaced')\n .addClass('placed inplace' + this.getPlace(drop));\n drag.attr('tabindex', 0);\n this.animateTo(drag, drop);\n }\n };\n\n /**\n * Animate a drag back to its home.\n *\n * @param {jQuery} drag the item being moved.\n */\n DragDropOntoImageQuestion.prototype.sendDragHome = function(drag) {\n var currentPlace = this.getClassnameNumericSuffix(drag, 'inplace');\n if (currentPlace !== null) {\n drag.removeClass('inplace' + currentPlace);\n }\n drag.data('unplaced', true);\n\n this.animateTo(drag, this.getDragHome(this.getGroup(drag), this.getChoice(drag)));\n };\n\n /**\n * Handles keyboard events on drops.\n *\n * Drops are focusable. Once focused, right/down/space switches to the next choice, and\n * left/up switches to the previous. Escape clear.\n *\n * @param {KeyboardEvent} e\n */\n DragDropOntoImageQuestion.prototype.handleKeyPress = function(e) {\n var drop = $(e.target).closest('.dropzone');\n if (drop.length === 0) {\n var placedDrag = $(e.target);\n var currentPlace = this.getClassnameNumericSuffix(placedDrag, 'inplace');\n if (currentPlace !== null) {\n drop = this.getDrop(placedDrag, currentPlace);\n }\n }\n var currentDrag = this.getCurrentDragInPlace(this.getPlace(drop)),\n nextDrag = $();\n\n switch (e.keyCode) {\n case keys.space:\n case keys.arrowRight:\n case keys.arrowDown:\n nextDrag = this.getNextDrag(this.getGroup(drop), currentDrag);\n break;\n\n case keys.arrowLeft:\n case keys.arrowUp:\n nextDrag = this.getPreviousDrag(this.getGroup(drop), currentDrag);\n break;\n\n case keys.escape:\n questionManager.isKeyboardNavigation = false;\n break;\n\n default:\n questionManager.isKeyboardNavigation = false;\n return; // To avoid the preventDefault below.\n }\n\n if (nextDrag.length) {\n nextDrag.data('isfocus', true);\n nextDrag.addClass('beingdragged');\n var hiddenDrag = this.getDragClone(nextDrag);\n if (hiddenDrag.length) {\n if (nextDrag.hasClass('infinite')) {\n var noOfDrags = this.noOfDropsInGroup(this.getGroup(nextDrag));\n var cloneDrags = this.getInfiniteDragClones(nextDrag, false);\n if (cloneDrags.length < noOfDrags) {\n var cloneDrag = nextDrag.clone();\n cloneDrag.removeClass('beingdragged');\n cloneDrag.removeAttr('tabindex');\n hiddenDrag.after(cloneDrag);\n questionManager.addEventHandlersToDrag(cloneDrag);\n nextDrag.offset(cloneDrag.offset());\n } else {\n hiddenDrag.addClass('active');\n nextDrag.offset(hiddenDrag.offset());\n }\n } else {\n hiddenDrag.addClass('active');\n nextDrag.offset(hiddenDrag.offset());\n }\n }\n } else {\n drop.data('isfocus', true);\n }\n\n e.preventDefault();\n this.sendDragToDrop(nextDrag, drop);\n };\n\n /**\n * Choose the next drag in a group.\n *\n * @param {int} group which group.\n * @param {jQuery} drag current choice (empty jQuery if there isn't one).\n * @return {jQuery} the next drag in that group, or null if there wasn't one.\n */\n DragDropOntoImageQuestion.prototype.getNextDrag = function(group, drag) {\n var choice,\n numChoices = this.noOfChoicesInGroup(group);\n\n if (drag.length === 0) {\n choice = 1; // Was empty, so we want to select the first choice.\n } else {\n choice = this.getChoice(drag) + 1;\n }\n\n var next = this.getUnplacedChoice(group, choice);\n while (next.length === 0 && choice < numChoices) {\n choice++;\n next = this.getUnplacedChoice(group, choice);\n }\n\n return next;\n };\n\n /**\n * Choose the previous drag in a group.\n *\n * @param {int} group which group.\n * @param {jQuery} drag current choice (empty jQuery if there isn't one).\n * @return {jQuery} the next drag in that group, or null if there wasn't one.\n */\n DragDropOntoImageQuestion.prototype.getPreviousDrag = function(group, drag) {\n var choice;\n\n if (drag.length === 0) {\n choice = this.noOfChoicesInGroup(group);\n } else {\n choice = this.getChoice(drag) - 1;\n }\n\n var previous = this.getUnplacedChoice(group, choice);\n while (previous.length === 0 && choice > 1) {\n choice--;\n previous = this.getUnplacedChoice(group, choice);\n }\n\n // Does this choice exist?\n return previous;\n };\n\n /**\n * Animate an object to the given destination.\n *\n * @param {jQuery} drag the element to be animated.\n * @param {jQuery} target element marking the place to move it to.\n */\n DragDropOntoImageQuestion.prototype.animateTo = function(drag, target) {\n var currentPos = drag.offset(),\n targetPos = target.offset(),\n thisQ = this;\n\n M.util.js_pending('qtype_ddimageortext-animate-' + thisQ.containerId);\n // Animate works in terms of CSS position, whereas locating an object\n // on the page works best with jQuery offset() function. So, to get\n // the right target position, we work out the required change in\n // offset() and then add that to the current CSS position.\n drag.animate(\n {\n left: parseInt(drag.css('left')) + targetPos.left - currentPos.left,\n top: parseInt(drag.css('top')) + targetPos.top - currentPos.top\n },\n {\n duration: 'fast',\n done: function() {\n $('body').trigger('qtype_ddimageortext-dragmoved', [drag, target, thisQ]);\n M.util.js_complete('qtype_ddimageortext-animate-' + thisQ.containerId);\n }\n }\n );\n };\n\n /**\n * Detect if a point is inside a given DOM node.\n *\n * @param {Number} pageX the x position.\n * @param {Number} pageY the y position.\n * @param {jQuery} drop the node to check (typically a drop).\n * @return {boolean} whether the point is inside the node.\n */\n DragDropOntoImageQuestion.prototype.isPointInDrop = function(pageX, pageY, drop) {\n var position = drop.offset();\n if (drop.hasClass('draghome')) {\n return pageX >= position.left && pageX < position.left + drop.outerWidth()\n && pageY >= position.top && pageY < position.top + drop.outerHeight();\n }\n return pageX >= position.left && pageX < position.left + drop.width()\n && pageY >= position.top && pageY < position.top + drop.height();\n };\n\n /**\n * Set the value of the hidden input for a place, to record what is currently there.\n *\n * @param {int} place which place to set the input value for.\n * @param {int} choice the value to set.\n */\n DragDropOntoImageQuestion.prototype.setInputValue = function(place, choice) {\n this.getRoot().find('input.placeinput.place' + place).val(choice);\n };\n\n /**\n * Get the outer div for this question.\n *\n * @returns {jQuery} containing that div.\n */\n DragDropOntoImageQuestion.prototype.getRoot = function() {\n return $(document.getElementById(this.containerId));\n };\n\n /**\n * Get the img that is the background image.\n * @returns {jQuery} containing that img.\n */\n DragDropOntoImageQuestion.prototype.bgImage = function() {\n return this.getRoot().find('img.dropbackground');\n };\n\n /**\n * Get drag home for a given choice.\n *\n * @param {int} group the group.\n * @param {int} choice the choice number.\n * @returns {jQuery} containing that div.\n */\n DragDropOntoImageQuestion.prototype.getDragHome = function(group, choice) {\n if (!this.getRoot().find('.draghome.dragplaceholder.group' + group + '.choice' + choice).is(':visible')) {\n return this.getRoot().find('.dragitemgroup' + group +\n ' .draghome.infinite' +\n '.choice' + choice +\n '.group' + group);\n }\n return this.getRoot().find('.draghome.dragplaceholder.group' + group + '.choice' + choice);\n };\n\n /**\n * Get an unplaced choice for a particular group.\n *\n * @param {int} group the group.\n * @param {int} choice the choice number.\n * @returns {jQuery} jQuery wrapping the unplaced choice. If there isn't one, the jQuery will be empty.\n */\n DragDropOntoImageQuestion.prototype.getUnplacedChoice = function(group, choice) {\n return this.getRoot().find('.ddarea .draghome.group' + group + '.choice' + choice + '.unplaced').slice(0, 1);\n };\n\n /**\n * Get the drag that is currently in a given place.\n *\n * @param {int} place the place number.\n * @return {jQuery} the current drag (or an empty jQuery if none).\n */\n DragDropOntoImageQuestion.prototype.getCurrentDragInPlace = function(place) {\n return this.getRoot().find('.ddarea .draghome.inplace' + place);\n };\n\n /**\n * Return the number of blanks in a given group.\n *\n * @param {int} group the group number.\n * @returns {int} the number of drops.\n */\n DragDropOntoImageQuestion.prototype.noOfDropsInGroup = function(group) {\n return this.getRoot().find('.dropzone.group' + group).length;\n };\n\n /**\n * Return the number of choices in a given group.\n *\n * @param {int} group the group number.\n * @returns {int} the number of choices.\n */\n DragDropOntoImageQuestion.prototype.noOfChoicesInGroup = function(group) {\n return this.getRoot().find('.dragitemgroup' + group + ' .draghome').length;\n };\n\n /**\n * Return the number at the end of the CSS class name with the given prefix.\n *\n * @param {jQuery} node\n * @param {String} prefix name prefix\n * @returns {Number|null} the suffix if found, else null.\n */\n DragDropOntoImageQuestion.prototype.getClassnameNumericSuffix = function(node, prefix) {\n var classes = node.attr('class');\n if (classes !== '') {\n var classesArr = classes.split(' ');\n for (var index = 0; index < classesArr.length; index++) {\n var patt1 = new RegExp('^' + prefix + '([0-9])+$');\n if (patt1.test(classesArr[index])) {\n var patt2 = new RegExp('([0-9])+$');\n var match = patt2.exec(classesArr[index]);\n return Number(match[0]);\n }\n }\n }\n return null;\n };\n\n /**\n * Get the choice number of a drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {Number} the choice number.\n */\n DragDropOntoImageQuestion.prototype.getChoice = function(drag) {\n return this.getClassnameNumericSuffix(drag, 'choice');\n };\n\n /**\n * Given a DOM node that is significant to this question\n * (drag, drop, ...) get the group it belongs to.\n *\n * @param {jQuery} node a DOM node.\n * @returns {Number} the group it belongs to.\n */\n DragDropOntoImageQuestion.prototype.getGroup = function(node) {\n return this.getClassnameNumericSuffix(node, 'group');\n };\n\n /**\n * Get the place number of a drop, or its corresponding hidden input.\n *\n * @param {jQuery} node the DOM node.\n * @returns {Number} the place number.\n */\n DragDropOntoImageQuestion.prototype.getPlace = function(node) {\n return this.getClassnameNumericSuffix(node, 'place');\n };\n\n /**\n * Get drag clone for a given drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {jQuery} the drag's clone.\n */\n DragDropOntoImageQuestion.prototype.getDragClone = function(drag) {\n return this.getRoot().find('.dragitemgroup' +\n this.getGroup(drag) +\n ' .draghome' +\n '.choice' + this.getChoice(drag) +\n '.group' + this.getGroup(drag) +\n '.dragplaceholder');\n };\n\n /**\n * Get infinite drag clones for given drag.\n *\n * @param {jQuery} drag the drag.\n * @param {Boolean} inHome in the home area or not.\n * @returns {jQuery} the drag's clones.\n */\n DragDropOntoImageQuestion.prototype.getInfiniteDragClones = function(drag, inHome) {\n if (inHome) {\n return this.getRoot().find('.dragitemgroup' +\n this.getGroup(drag) +\n ' .draghome' +\n '.choice' + this.getChoice(drag) +\n '.group' + this.getGroup(drag) +\n '.infinite').not('.dragplaceholder');\n }\n return this.getRoot().find('.draghome' +\n '.choice' + this.getChoice(drag) +\n '.group' + this.getGroup(drag) +\n '.infinite').not('.dragplaceholder');\n };\n\n /**\n * Get drop for a given drag and place.\n *\n * @param {jQuery} drag the drag.\n * @param {Integer} currentPlace the current place of drag.\n * @returns {jQuery} the drop's clone.\n */\n DragDropOntoImageQuestion.prototype.getDrop = function(drag, currentPlace) {\n return this.getRoot().find('.dropzone.group' + this.getGroup(drag) + '.place' + currentPlace);\n };\n\n /**\n * Handle when the window is resized.\n */\n DragDropOntoImageQuestion.prototype.handleResize = function() {\n var thisQ = this,\n bgRatio = this.bgRatio();\n if (this.isPrinting) {\n bgRatio = 1;\n }\n\n this.getRoot().find('.ddarea .dropzone').each(function(i, dropNode) {\n $(dropNode)\n .css('left', parseInt($(dropNode).data('originX')) * parseFloat(bgRatio))\n .css('top', parseInt($(dropNode).data('originY')) * parseFloat(bgRatio));\n thisQ.handleElementScale(dropNode, 'left top');\n });\n\n this.getRoot().find('div.droparea .draghome').not('.beingdragged').each(function(key, drag) {\n $(drag)\n .css('left', parseFloat($(drag).data('originX')) * parseFloat(bgRatio))\n .css('top', parseFloat($(drag).data('originY')) * parseFloat(bgRatio));\n thisQ.handleElementScale(drag, 'left top');\n });\n };\n\n /**\n * Return the background ratio.\n *\n * @returns {number} Background ratio.\n */\n DragDropOntoImageQuestion.prototype.bgRatio = function() {\n var bgImg = this.bgImage();\n var bgImgNaturalWidth = bgImg.get(0).naturalWidth;\n var bgImgClientWidth = bgImg.width();\n\n return bgImgClientWidth / bgImgNaturalWidth;\n };\n\n /**\n * Scale the drag if needed.\n *\n * @param {jQuery} element the item to place.\n * @param {String} type scaling type\n */\n DragDropOntoImageQuestion.prototype.handleElementScale = function(element, type) {\n var bgRatio = parseFloat(this.bgRatio());\n if (this.isPrinting) {\n bgRatio = 1;\n }\n $(element).css({\n '-webkit-transform': 'scale(' + bgRatio + ')',\n '-moz-transform': 'scale(' + bgRatio + ')',\n '-ms-transform': 'scale(' + bgRatio + ')',\n '-o-transform': 'scale(' + bgRatio + ')',\n 'transform': 'scale(' + bgRatio + ')',\n 'transform-origin': type\n });\n };\n\n /**\n * Calculate z-index value.\n *\n * @returns {number} z-index value\n */\n DragDropOntoImageQuestion.prototype.calculateZIndex = function() {\n var zIndex = 0;\n this.getRoot().find('.ddarea .dropzone, div.droparea .draghome').each(function(i, dropNode) {\n dropNode = $(dropNode);\n // Note that webkit browsers won't return the z-index value from the CSS stylesheet\n // if the element doesn't have a position specified. Instead it'll return \"auto\".\n var itemZIndex = dropNode.css('z-index') ? parseInt(dropNode.css('z-index')) : 0;\n\n if (itemZIndex > zIndex) {\n zIndex = itemZIndex;\n }\n });\n\n return zIndex;\n };\n\n /**\n * Check that the drag is drop to it's clone.\n *\n * @param {jQuery} drag The drag.\n * @param {jQuery} drop The drop.\n * @returns {boolean}\n */\n DragDropOntoImageQuestion.prototype.isDragSameAsDrop = function(drag, drop) {\n return this.getChoice(drag) === this.getChoice(drop) && this.getGroup(drag) === this.getGroup(drop);\n };\n\n /**\n * Singleton object that handles all the DragDropOntoImageQuestions\n * on the page, and deals with event dispatching.\n * @type {Object}\n */\n var questionManager = {\n\n /**\n * {boolean} ensures that the event handlers are only initialised once per page.\n */\n eventHandlersInitialised: false,\n\n /**\n * {Object} ensures that the drag event handlers are only initialised once per question,\n * indexed by containerId (id on the .que div).\n */\n dragEventHandlersInitialised: {},\n\n /**\n * {boolean} is printing or not.\n */\n isPrinting: false,\n\n /**\n * {boolean} is keyboard navigation or not.\n */\n isKeyboardNavigation: false,\n\n /**\n * {Object} all the questions on this page, indexed by containerId (id on the .que div).\n */\n questions: {}, // An object containing all the information about each question on the page.\n\n /**\n * Initialise one question.\n *\n * @method\n * @param {String} containerId the id of the div.que that contains this question.\n * @param {boolean} readOnly whether the question is read-only.\n * @param {Array} places data.\n */\n init: function(containerId, readOnly, places) {\n questionManager.questions[containerId] =\n new DragDropOntoImageQuestion(containerId, readOnly, places);\n if (!questionManager.eventHandlersInitialised) {\n questionManager.setupEventHandlers();\n questionManager.eventHandlersInitialised = true;\n }\n if (!questionManager.dragEventHandlersInitialised.hasOwnProperty(containerId)) {\n questionManager.dragEventHandlersInitialised[containerId] = true;\n // We do not use the body event here to prevent the other event on Mobile device, such as scroll event.\n var questionContainer = document.getElementById(containerId);\n if (questionContainer.classList.contains('ddimageortext') &&\n !questionContainer.classList.contains('qtype_ddimageortext-readonly')) {\n // TODO: Convert all the jQuery selectors and events to native Javascript.\n questionManager.addEventHandlersToDrag($(questionContainer).find('.draghome'));\n }\n }\n },\n\n /**\n * Set up the event handlers that make this question type work. (Done once per page.)\n */\n setupEventHandlers: function() {\n $('body')\n .on('keydown',\n '.que.ddimageortext:not(.qtype_ddimageortext-readonly) .dropzones .dropzone',\n questionManager.handleKeyPress)\n .on('keydown',\n '.que.ddimageortext:not(.qtype_ddimageortext-readonly) .draghome.placed:not(.beingdragged)',\n questionManager.handleKeyPress)\n .on('qtype_ddimageortext-dragmoved', questionManager.handleDragMoved);\n $(window).on('resize', function() {\n questionManager.handleWindowResize(false);\n });\n window.addEventListener('beforeprint', function() {\n questionManager.isPrinting = true;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n window.addEventListener('afterprint', function() {\n questionManager.isPrinting = false;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved();\n }, 100);\n },\n\n /**\n * Binding the drag/touch event again for newly created element.\n *\n * @param {jQuery} element Element to bind the event\n */\n addEventHandlersToDrag: function(element) {\n // Unbind all the mousedown and touchstart events to prevent double binding.\n element.unbind('mousedown touchstart');\n element.on('mousedown touchstart', questionManager.handleDragStart);\n },\n\n /**\n * Handle mouse down / touch start events on drags.\n * @param {Event} e the DOM event.\n */\n handleDragStart: function(e) {\n e.preventDefault();\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleDragStart(e);\n }\n },\n\n /**\n * Handle key down / press events on drags.\n * @param {KeyboardEvent} e\n */\n handleKeyPress: function(e) {\n if (questionManager.isKeyboardNavigation) {\n return;\n }\n questionManager.isKeyboardNavigation = true;\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleKeyPress(e);\n }\n },\n\n /**\n * Handle when the window is resized.\n * @param {boolean} isPrinting\n */\n handleWindowResize: function(isPrinting) {\n for (var containerId in questionManager.questions) {\n if (questionManager.questions.hasOwnProperty(containerId)) {\n questionManager.questions[containerId].isPrinting = isPrinting;\n questionManager.questions[containerId].handleResize();\n }\n }\n },\n\n /**\n * Sometimes, despite our best efforts, things change in a way that cannot\n * be specifically caught (e.g. dock expanding or collapsing in Boost).\n * Therefore, we need to periodically check everything is in the right position.\n */\n fixLayoutIfThingsMoved: function() {\n this.handleWindowResize(questionManager.isPrinting);\n // We use setTimeout after finishing work, rather than setInterval,\n // in case positioning things is slow. We want 100 ms gap\n // between executions, not what setInterval does.\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting);\n }, 100);\n },\n\n /**\n * Handle when drag moved.\n *\n * @param {Event} e the event.\n * @param {jQuery} drag the drag\n * @param {jQuery} target the target\n * @param {DragDropOntoImageQuestion} thisQ the question.\n */\n handleDragMoved: function(e, drag, target, thisQ) {\n drag.removeClass('beingdragged').css('z-index', '');\n drag.css('top', target.position().top).css('left', target.position().left);\n target.after(drag);\n target.removeClass('active');\n if (typeof drag.data('unplaced') !== 'undefined' && drag.data('unplaced') === true) {\n drag.removeClass('placed').addClass('unplaced');\n drag.removeAttr('tabindex');\n drag.removeData('unplaced');\n drag.css('top', '')\n .css('left', '')\n .css('transform', '');\n if (drag.hasClass('infinite') && thisQ.getInfiniteDragClones(drag, true).length > 1) {\n thisQ.getInfiniteDragClones(drag, true).first().remove();\n }\n } else {\n drag.data('originX', target.data('originX')).data('originY', target.data('originY'));\n thisQ.handleElementScale(drag, 'left top');\n }\n if (typeof drag.data('isfocus') !== 'undefined' && drag.data('isfocus') === true) {\n drag.focus();\n drag.removeData('isfocus');\n }\n if (typeof target.data('isfocus') !== 'undefined' && target.data('isfocus') === true) {\n target.removeData('isfocus');\n }\n if (questionManager.isKeyboardNavigation) {\n questionManager.isKeyboardNavigation = false;\n }\n if (thisQ.isQuestionInteracted()) {\n // The user has interacted with the draggable items. We need to mark the form as dirty.\n questionManager.handleFormDirty();\n // Save the new answered value.\n thisQ.questionAnswer = thisQ.getQuestionAnsweredValues();\n }\n },\n\n /**\n * Given an event, work out which question it effects.\n * @param {Event} e the event.\n * @returns {DragDropOntoImageQuestion|undefined} The question, or undefined.\n */\n getQuestionForEvent: function(e) {\n var containerId = $(e.currentTarget).closest('.que.ddimageortext').attr('id');\n return questionManager.questions[containerId];\n },\n\n /**\n * Handle when the form is dirty.\n */\n handleFormDirty: function() {\n const responseForm = document.getElementById('responseform');\n FormChangeChecker.markFormAsDirty(responseForm);\n }\n };\n\n /**\n * @alias module:qtype_ddimageortext/question\n */\n return {\n init: questionManager.init\n };\n});\n"],"names":["define","$","dragDrop","keys","FormChangeChecker","filterEvent","DragDropOntoImageQuestion","containerId","readOnly","places","questionAnswer","questionDragDropWidthHeight","M","util","js_pending","this","allImagesLoaded","imageLoadingTimeoutId","isPrinting","getRoot","addClass","thisQ","getNotYetLoadedImages","one","waitForAllImagesToBeLoaded","prototype","changeAllDragsAndDropsToFilteredContent","filteredElement","currentFilteredItem","parentIsDD","parent","closest","hasClass","isDD","find","length","group","getGroup","choice","getChoice","listOfModifiedDragDrop","each","i","node","get","originalClass","attr","originalStyle","filteredDragDropClone","clone","questionManager","addEventHandlersToDrag","before","push","forEach","remove","currentHeight","height","currentWidth","width","offsetWidth","offsetHeight","classList","add","maxWidth","Math","ceil","maxHeight","resizeAllDragsAndDropsInGroup","top","floor","css","clearTimeout","setTimeout","setupQuestion","document","addEventListener","eventTypes","filterContentRenderingComplete","elements","detail","nodes","element","not","imgNode","imageIsLoaded","imgElement","complete","naturalHeight","resizeAllDragsAndDrops","cloneDrags","positionDragsAndDrops","js_complete","getClassnameNumericSuffix","root","dragHomes","drag","max","hasOwnProperty","place","label","text","parseInt","get_string","append","index","dragHome","placeHolder","removeClass","cloneDragsForOneChoice","noOfDrags","noOfDropsInGroup","cloneDrag","offset","bgRatio","dropNode","drop","getPlace","xy","data","handleElementScale","dragNode","currentPlace","removeAttr","inputNode","input","val","unplacedDrag","getUnplacedChoice","hiddenDrag","getDragClone","getInfiniteDragClones","after","sendDragToDrop","getQuestionAnsweredValues","result","id","value","isQuestionInteracted","oldAnswer","newAnswer","isInteracted","JSON","stringify","Object","key","handleDragStart","e","target","newIndex","calculateZIndex","prepare","start","setInputValue","hiddenDrop","getDrop","x","y","dragMove","dragEnd","pageX","pageY","highlighted","isPointInDrop","isDragSameAsDrop","placed","placedNode","placedDrag","sendDragHome","oldDrag","getCurrentDragInPlace","focus","animateTo","getDragHome","handleKeyPress","currentDrag","nextDrag","keyCode","space","arrowRight","arrowDown","getNextDrag","arrowLeft","arrowUp","getPreviousDrag","escape","isKeyboardNavigation","preventDefault","numChoices","noOfChoicesInGroup","next","previous","currentPos","targetPos","animate","left","duration","done","trigger","position","outerWidth","outerHeight","getElementById","bgImage","is","slice","prefix","classes","classesArr","split","RegExp","test","match","exec","Number","inHome","handleResize","parseFloat","bgImg","bgImgNaturalWidth","naturalWidth","type","zIndex","itemZIndex","eventHandlersInitialised","dragEventHandlersInitialised","questions","init","setupEventHandlers","questionContainer","contains","on","handleDragMoved","window","handleWindowResize","fixLayoutIfThingsMoved","unbind","question","getQuestionForEvent","removeData","first","handleFormDirty","currentTarget","responseForm","markFormAsDirty"],"mappings":"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"} \ No newline at end of file diff --git a/question/type/ddimageortext/amd/src/question.js b/question/type/ddimageortext/amd/src/question.js index a4e1e497799..d3ec30bc022 100644 --- a/question/type/ddimageortext/amd/src/question.js +++ b/question/type/ddimageortext/amd/src/question.js @@ -1120,9 +1120,9 @@ define([ * @method * @param {String} containerId the id of the div.que that contains this question. * @param {boolean} readOnly whether the question is read-only. + * @param {Array} places data. */ - init: function(containerId, readOnly) { - const places = JSON.parse(document.querySelector('#' + containerId + ' .dropzones').dataset.placeInfo); + init: function(containerId, readOnly, places) { questionManager.questions[containerId] = new DragDropOntoImageQuestion(containerId, readOnly, places); if (!questionManager.eventHandlersInitialised) { diff --git a/question/type/ddimageortext/rendererbase.php b/question/type/ddimageortext/rendererbase.php index 0be0ea91f17..a283af33983 100644 --- a/question/type/ddimageortext/rendererbase.php +++ b/question/type/ddimageortext/rendererbase.php @@ -75,21 +75,7 @@ class qtype_ddtoimage_renderer_base extends qtype_with_combined_feedback_rendere $output .= html_writer::img(self::get_url_for_image($qa, 'bgimage'), get_string('dropbackground', 'qtype_ddmarker'), ['class' => 'dropbackground img-fluid w-100']); - // Note, the mobile app implementation of ddimageortext relies on extracting the - // blob of places data out of the rendered HTML, which makes it impossible - // to clean up this structure of otherwise unnecessary stuff. - $placeinfoforjsandmobileapp = []; - foreach ($question->places as $placeno => $place) { - $varname = $question->field($placeno); - [$fieldname, $html] = $this->hidden_field_for_qt_var($qa, $varname, null, - ['placeinput', 'place' . $placeno, 'group' . $place->group]); - $output .= $html; - $placeinfo = (object) (array) $place; - $placeinfo->fieldname = $fieldname; - $placeinfoforjsandmobileapp[$placeno] = $placeinfo; - } - - $output .= html_writer::div('', 'dropzones', ['data-place-info' => json_encode($placeinfoforjsandmobileapp)]); + $output .= html_writer::div('', 'dropzones'); $output .= html_writer::end_div(); $output .= html_writer::start_div($draghomesclass); @@ -121,11 +107,26 @@ class qtype_ddtoimage_renderer_base extends qtype_with_combined_feedback_rendere $output .= $dragimagehomes; $output .= html_writer::end_div(); + // Note, the mobile app implementation of ddimageortext relies on extracting the + // blob of places data out of the rendered HTML, which makes it impossible + // to clean up this structure of otherwise unnecessary stuff. + $placeinfoforjsandmobileapp = []; + foreach ($question->places as $placeno => $place) { + $varname = $question->field($placeno); + [$fieldname, $html] = $this->hidden_field_for_qt_var($qa, $varname, null, + ['placeinput', 'place' . $placeno, 'group' . $place->group]); + $output .= $html; + $placeinfo = (object) (array) $place; + $placeinfo->fieldname = $fieldname; + $placeinfo->text = format_string($placeinfo->text); + $placeinfoforjsandmobileapp[$placeno] = $placeinfo; + } + $output .= html_writer::end_div(); $this->page->requires->string_for_js('blank', 'qtype_ddimageortext'); $this->page->requires->js_call_amd('qtype_ddimageortext/question', 'init', - [$qa->get_outer_question_div_unique_id(), $options->readonly]); + [$qa->get_outer_question_div_unique_id(), $options->readonly, $placeinfoforjsandmobileapp]); if ($qa->get_state() == question_state::$invalid) { $output .= html_writer::div($question->get_validation_error($qa->get_last_qt_data()), 'validationerror'); diff --git a/question/type/ddimageortext/tests/walkthrough_test.php b/question/type/ddimageortext/tests/walkthrough_test.php index 4404c1c92da..fd98d4e5ab2 100644 --- a/question/type/ddimageortext/tests/walkthrough_test.php +++ b/question/type/ddimageortext/tests/walkthrough_test.php @@ -68,8 +68,6 @@ final class walkthrough_test extends \qbehaviour_walkthrough_test_base { $this->check_current_mark(null); $this->check_current_output( - new \question_pattern_expectation( - '~
get_contains_drag_image_home_expectation(1, 1, 1), $this->get_contains_drag_image_home_expectation(2, 2, 1), $this->get_contains_drag_image_home_expectation(3, 1, 2), diff --git a/question/type/ddmarker/amd/build/question.min.js b/question/type/ddmarker/amd/build/question.min.js index ceb147b9f10..be876db2403 100644 --- a/question/type/ddmarker/amd/build/question.min.js +++ b/question/type/ddmarker/amd/build/question.min.js @@ -5,6 +5,6 @@ * @copyright 2018 The Open University * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later */ -define("qtype_ddmarker/question",["jquery","core/dragdrop","qtype_ddmarker/shapes","core/key_codes","core_form/changechecker","core_filters/events"],(function($,dragDrop,Shapes,keys,FormChangeChecker,filterEvent){function DragDropMarkersQuestion(containerId,readOnly,visibleDropZones){var thisQ=this;this.containerId=containerId,this.visibleDropZones=visibleDropZones,this.shapes=[],this.shapeSVGs=[],this.isPrinting=!1,this.questionAnswer={},readOnly&&this.getRoot().addClass("qtype_ddmarker-readonly"),thisQ.allImagesLoaded=!1,thisQ.getNotYetLoadedImages().one("load",(function(){thisQ.waitForAllImagesToBeLoaded()})),thisQ.waitForAllImagesToBeLoaded()}DragDropMarkersQuestion.prototype.drawDropzones=function(){if(this.visibleDropZones.length>0){var bgImage=this.bgImage();this.getRoot().find("div.dropzones").html('');for(var svg=this.getRoot().find("svg.dropzones"),nextColourIndex=0,dropZoneNo=0;dropZoneNo'+dropZone.markertext+"");var markerspan=this.getRoot().find("div.ddarea div.markertexts span.markertext"+dropZoneNo);if(markerspan.length){var handles=shape.getHandlePositions(),positionLeft=handles.moveHandle.x-markerspan.outerWidth()/2-4,positionTop=handles.moveHandle.y-markerspan.outerHeight()/2;markerspan.css("left",positionLeft).css("top",positionTop),markerspan.data("originX",markerspan.position().left/bgRatio).data("originY",markerspan.position().top/bgRatio),this.handleElementScale(markerspan,"center")}filterEvent.notifyFilterContentUpdated(markerspan)}var shapeSVG=shape.makeSvg(svg[0]);shapeSVG.setAttribute("class","dropzone "+colourClass),this.shapes[this.shapes.length]=shape,this.shapeSVGs[this.shapeSVGs.length]=shapeSVG}},DragDropMarkersQuestion.prototype.repositionDrags=function(){var root=this.getRoot(),thisQ=this;root.find("div.draghomes .marker").not(".dragplaceholder").each((function(key,item){$(item).addClass("unneeded")})),root.find("input.choices").each((function(key,input){var choiceNo=thisQ.getChoiceNoFromElement(input),imageCoords=thisQ.getImageCoords(input);if(imageCoords.length){var drag=thisQ.getRoot().find(".draghomes span.marker.choice"+choiceNo).not(".dragplaceholder");drag.remove();for(var i=0;i{result[inputNode.id]=inputNode.value})),result},DragDropMarkersQuestion.prototype.isQuestionInteracted=function(){const oldAnswer=this.questionAnswer,newAnswer=this.getQuestionAnsweredValues();let isInteracted=!1;return JSON.stringify(newAnswer)!==JSON.stringify(oldAnswer)?(isInteracted=!0,isInteracted):(Object.keys(newAnswer).forEach((key=>{newAnswer[key]!==oldAnswer[key]&&(isInteracted=!0)})),isInteracted)},DragDropMarkersQuestion.prototype.getImageCoords=function(inputNode){var imageCoords=[],val=$(inputNode).val();if(""!==val)for(var coordsStrings=val.split(";"),i=0;i=bgPosition.left&&point.x=bgPosition.top&&point.y2&&void 0!==arguments[2]&&arguments[2];var dropArea=this.dropArea(),bgRatio=this.bgRatio();drag.removeClass("beingdragged").removeClass("unneeded");var dragXY=this.convertToBgImgXY(new Shapes.Point(drag.data("pagex"),drag.data("pagey")));isScaling?(drag.data("originX",dragXY.x/bgRatio).data("originY",dragXY.y/bgRatio),drag.css("left",dragXY.x).css("top",dragXY.y)):(drag.data("originX",dragXY.x).data("originY",dragXY.y),drag.css("left",dragXY.x*bgRatio).css("top",dragXY.y*bgRatio)),initialLoad||drag.data("scaleRatio",bgRatio),dropArea.append(drag),this.handleElementScale(drag,"left top")},DragDropMarkersQuestion.prototype.cloneDragIfNeeded=function(drag){var inputNode=this.getInput(drag),noOfDrags=Number(this.getClassnameNumericSuffix(inputNode,"noofdrags")),displayedDragsInDropArea=this.getRoot().find("div.droparea .marker.choice"+this.getChoiceNoFromElement(drag)+this.getDragNoClass(drag,!0)).length,displayedDragsInDragHomes=this.getRoot().find("div.draghomes .marker.choice"+this.getChoiceNoFromElement(drag)+this.getDragNoClass(drag,!0)).not(".dragplaceholder").length;if((this.isInfiniteDrag(drag)||!this.isInfiniteDrag(drag)&&displayedDragsInDropArea1;)dragsInHome.first().remove(),displayedDrags--},DragDropMarkersQuestion.prototype.getInput=function(drag){var choiceNo=this.getChoiceNoFromElement(drag);return this.getRoot().find("input.choices.choice"+choiceNo)},DragDropMarkersQuestion.prototype.bgRatio=function(){var bgImg=this.bgImage(),bgImgNaturalWidth=bgImg.get(0).naturalWidth;return bgImg.width()/bgImgNaturalWidth},DragDropMarkersQuestion.prototype.handleElementScale=function(element,type){var bgRatio=parseFloat(this.bgRatio());this.isPrinting&&(bgRatio=1),$(element).css({"-webkit-transform":"scale("+bgRatio+")","-moz-transform":"scale("+bgRatio+")","-ms-transform":"scale("+bgRatio+")","-o-transform":"scale("+bgRatio+")",transform:"scale("+bgRatio+")","transform-origin":type})},DragDropMarkersQuestion.prototype.isInfiniteDrag=function(drag){return drag.hasClass("infinite")},DragDropMarkersQuestion.prototype.waitForAllImagesToBeLoaded=function(){var thisQ=this;this.allImagesLoaded||(null!==this.imageLoadingTimeoutId&&clearTimeout(this.imageLoadingTimeoutId),this.getNotYetLoadedImages().length>0?this.imageLoadingTimeoutId=setTimeout((function(){this.waitForAllImagesToBeLoaded()}),100):(this.allImagesLoaded=!0,this.cloneDrags(),this.repositionDrags(),this.drawDropzones(),document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete,(elements=>{elements.detail.nodes.forEach((element=>{thisQ.changeAllMakerToFilteredContent(element)}))}))))},DragDropMarkersQuestion.prototype.changeAllMakerToFilteredContent=function(filteredElement){let currentFilteredItem=$(filteredElement);const parentIsMarker=currentFilteredItem.parent().closest("span.marker"),isMarker=currentFilteredItem.hasClass("marker"),root=this.getRoot();if(!parentIsMarker&&!isMarker)return;if(parentIsMarker&&(currentFilteredItem=currentFilteredItem.parent().closest("span.marker")),root.find(currentFilteredItem).length<=0)return;const dragNo=this.getDragNo(currentFilteredItem),choiceNo=this.getChoiceNoFromElement(currentFilteredItem),listOfContainerToBeModifed=["div.draghomes .marker:not(.dragplaceholder).dragno"+dragNo+".choice"+choiceNo,"div.droparea .marker:not(.dragplaceholder).dragno"+dragNo+".choice"+choiceNo,"div.draghomes .marker:not(.dragplaceholder).infinite.choice"+choiceNo,"div.droparea .marker:not(.dragplaceholder).infinite.choice"+choiceNo];let listOfModifiedDragDrop=[];const filteredDragDropClone=currentFilteredItem.clone();listOfContainerToBeModifed.forEach((function(selector){root.find(selector).each((function(i,node){const originalClass=$(node).attr("class"),originalStyle=$(node).attr("style");filteredDragDropClone.attr("class",originalClass),filteredDragDropClone.attr("style",originalStyle),questionManager.addEventHandlersToMarker(filteredDragDropClone),$(node).before(filteredDragDropClone),listOfModifiedDragDrop.push(node)}))})),listOfModifiedDragDrop.forEach((function(node){$(node).remove()}))},DragDropMarkersQuestion.prototype.getNotYetLoadedImages=function(){return this.getRoot().find(".ddmarker img.dropbackground").not((function(i,imgNode){return this.imageIsLoaded(imgNode)}))},DragDropMarkersQuestion.prototype.imageIsLoaded=function(imgElement){return imgElement.complete&&0!==imgElement.naturalHeight};var questionManager={eventHandlersInitialised:!1,markerEventHandlersInitialised:{},isPrinting:!1,isKeyboardNavigation:!1,questions:{},init:function(containerId,readOnly){const visibleDropZones=JSON.parse(document.querySelector("#"+containerId+" .dropzones").dataset.visibledDropzones);if(questionManager.questions[containerId]=new DragDropMarkersQuestion(containerId,readOnly,visibleDropZones),questionManager.eventHandlersInitialised||(questionManager.setupEventHandlers(),questionManager.eventHandlersInitialised=!0),!questionManager.markerEventHandlersInitialised.hasOwnProperty(containerId)){questionManager.markerEventHandlersInitialised[containerId]=!0;var questionContainer=document.getElementById(containerId);questionContainer.classList.contains("ddmarker")&&!questionContainer.classList.contains("qtype_ddmarker-readonly")&&(questionManager.addEventHandlersToMarker($(questionContainer).find("div.draghomes .marker")),questionManager.addEventHandlersToMarker($(questionContainer).find("div.droparea .marker")))}},setupEventHandlers:function(){$(window).on("resize",(function(){questionManager.handleWindowResize(!1)})),window.addEventListener("beforeprint",(function(){questionManager.isPrinting=!0,questionManager.handleWindowResize(questionManager.isPrinting)})),window.addEventListener("afterprint",(function(){questionManager.isPrinting=!1,questionManager.handleWindowResize(questionManager.isPrinting)})),setTimeout((function(){questionManager.fixLayoutIfThingsMoved()}),100)},addEventHandlersToMarker:function(element){element.on("mousedown touchstart",questionManager.handleDragStart).on("keydown keypress",questionManager.handleKeyPress).focusin((function(e){questionManager.handleKeyboardFocus(e,!0)})).focusout((function(e){questionManager.handleKeyboardFocus(e,!1)}))},handleDragStart:function(e){e.preventDefault();var question=questionManager.getQuestionForEvent(e);question&&question.handleDragStart(e)},handleKeyPress:function(e){var question=questionManager.getQuestionForEvent(e);question&&question.handleKeyPress(e)},handleWindowResize:function(isPrinting){for(var containerId in questionManager.questions)questionManager.questions.hasOwnProperty(containerId)&&(questionManager.questions[containerId].isPrinting=isPrinting,questionManager.questions[containerId].handleResize())},handleKeyboardFocus:function(e,isNavigating){questionManager.isKeyboardNavigation=isNavigating},fixLayoutIfThingsMoved:function(){questionManager.isKeyboardNavigation||this.handleWindowResize(questionManager.isPrinting),setTimeout((function(){questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting)}),100)},getQuestionForEvent:function(e){var containerId=$(e.currentTarget).closest(".que.ddmarker").attr("id");return questionManager.questions[containerId]},handleFormDirty:function(){const responseForm=document.getElementById("responseform");FormChangeChecker.markFormAsDirty(responseForm)}};return{init:questionManager.init}})); +define("qtype_ddmarker/question",["jquery","core/dragdrop","qtype_ddmarker/shapes","core/key_codes","core_form/changechecker","core_filters/events"],(function($,dragDrop,Shapes,keys,FormChangeChecker,filterEvent){function DragDropMarkersQuestion(containerId,readOnly,visibleDropZones){var thisQ=this;this.containerId=containerId,this.visibleDropZones=visibleDropZones,this.shapes=[],this.shapeSVGs=[],this.isPrinting=!1,this.questionAnswer={},readOnly&&this.getRoot().addClass("qtype_ddmarker-readonly"),thisQ.allImagesLoaded=!1,thisQ.getNotYetLoadedImages().one("load",(function(){thisQ.waitForAllImagesToBeLoaded()})),thisQ.waitForAllImagesToBeLoaded()}DragDropMarkersQuestion.prototype.drawDropzones=function(){if(this.visibleDropZones.length>0){var bgImage=this.bgImage();this.getRoot().find("div.dropzones").html('');for(var svg=this.getRoot().find("svg.dropzones"),nextColourIndex=0,dropZoneNo=0;dropZoneNo'+dropZone.markertext+"");var markerspan=this.getRoot().find("div.ddarea div.markertexts span.markertext"+dropZoneNo);if(markerspan.length){var handles=shape.getHandlePositions(),positionLeft=handles.moveHandle.x-markerspan.outerWidth()/2-4,positionTop=handles.moveHandle.y-markerspan.outerHeight()/2;markerspan.css("left",positionLeft).css("top",positionTop),markerspan.data("originX",markerspan.position().left/bgRatio).data("originY",markerspan.position().top/bgRatio),this.handleElementScale(markerspan,"center")}filterEvent.notifyFilterContentUpdated(markerspan)}var shapeSVG=shape.makeSvg(svg[0]);shapeSVG.setAttribute("class","dropzone "+colourClass),this.shapes[this.shapes.length]=shape,this.shapeSVGs[this.shapeSVGs.length]=shapeSVG}},DragDropMarkersQuestion.prototype.repositionDrags=function(){var root=this.getRoot(),thisQ=this;root.find("div.draghomes .marker").not(".dragplaceholder").each((function(key,item){$(item).addClass("unneeded")})),root.find("input.choices").each((function(key,input){var choiceNo=thisQ.getChoiceNoFromElement(input),imageCoords=thisQ.getImageCoords(input);if(imageCoords.length){var drag=thisQ.getRoot().find(".draghomes span.marker.choice"+choiceNo).not(".dragplaceholder");drag.remove();for(var i=0;i{result[inputNode.id]=inputNode.value})),result},DragDropMarkersQuestion.prototype.isQuestionInteracted=function(){const oldAnswer=this.questionAnswer,newAnswer=this.getQuestionAnsweredValues();let isInteracted=!1;return JSON.stringify(newAnswer)!==JSON.stringify(oldAnswer)?(isInteracted=!0,isInteracted):(Object.keys(newAnswer).forEach((key=>{newAnswer[key]!==oldAnswer[key]&&(isInteracted=!0)})),isInteracted)},DragDropMarkersQuestion.prototype.getImageCoords=function(inputNode){var imageCoords=[],val=$(inputNode).val();if(""!==val)for(var coordsStrings=val.split(";"),i=0;i=bgPosition.left&&point.x=bgPosition.top&&point.y2&&void 0!==arguments[2]&&arguments[2];var dropArea=this.dropArea(),bgRatio=this.bgRatio();drag.removeClass("beingdragged").removeClass("unneeded");var dragXY=this.convertToBgImgXY(new Shapes.Point(drag.data("pagex"),drag.data("pagey")));isScaling?(drag.data("originX",dragXY.x/bgRatio).data("originY",dragXY.y/bgRatio),drag.css("left",dragXY.x).css("top",dragXY.y)):(drag.data("originX",dragXY.x).data("originY",dragXY.y),drag.css("left",dragXY.x*bgRatio).css("top",dragXY.y*bgRatio)),initialLoad||drag.data("scaleRatio",bgRatio),dropArea.append(drag),this.handleElementScale(drag,"left top")},DragDropMarkersQuestion.prototype.cloneDragIfNeeded=function(drag){var inputNode=this.getInput(drag),noOfDrags=Number(this.getClassnameNumericSuffix(inputNode,"noofdrags")),displayedDragsInDropArea=this.getRoot().find("div.droparea .marker.choice"+this.getChoiceNoFromElement(drag)+this.getDragNoClass(drag,!0)).length,displayedDragsInDragHomes=this.getRoot().find("div.draghomes .marker.choice"+this.getChoiceNoFromElement(drag)+this.getDragNoClass(drag,!0)).not(".dragplaceholder").length;if((this.isInfiniteDrag(drag)||!this.isInfiniteDrag(drag)&&displayedDragsInDropArea1;)dragsInHome.first().remove(),displayedDrags--},DragDropMarkersQuestion.prototype.getInput=function(drag){var choiceNo=this.getChoiceNoFromElement(drag);return this.getRoot().find("input.choices.choice"+choiceNo)},DragDropMarkersQuestion.prototype.bgRatio=function(){var bgImg=this.bgImage(),bgImgNaturalWidth=bgImg.get(0).naturalWidth;return bgImg.width()/bgImgNaturalWidth},DragDropMarkersQuestion.prototype.handleElementScale=function(element,type){var bgRatio=parseFloat(this.bgRatio());this.isPrinting&&(bgRatio=1),$(element).css({"-webkit-transform":"scale("+bgRatio+")","-moz-transform":"scale("+bgRatio+")","-ms-transform":"scale("+bgRatio+")","-o-transform":"scale("+bgRatio+")",transform:"scale("+bgRatio+")","transform-origin":type})},DragDropMarkersQuestion.prototype.isInfiniteDrag=function(drag){return drag.hasClass("infinite")},DragDropMarkersQuestion.prototype.waitForAllImagesToBeLoaded=function(){var thisQ=this;this.allImagesLoaded||(null!==this.imageLoadingTimeoutId&&clearTimeout(this.imageLoadingTimeoutId),this.getNotYetLoadedImages().length>0?this.imageLoadingTimeoutId=setTimeout((function(){this.waitForAllImagesToBeLoaded()}),100):(this.allImagesLoaded=!0,this.cloneDrags(),this.repositionDrags(),this.drawDropzones(),document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete,(elements=>{elements.detail.nodes.forEach((element=>{thisQ.changeAllMakerToFilteredContent(element)}))}))))},DragDropMarkersQuestion.prototype.changeAllMakerToFilteredContent=function(filteredElement){let currentFilteredItem=$(filteredElement);const parentIsMarker=currentFilteredItem.parent().closest("span.marker"),isMarker=currentFilteredItem.hasClass("marker"),root=this.getRoot();if(!parentIsMarker&&!isMarker)return;if(parentIsMarker&&(currentFilteredItem=currentFilteredItem.parent().closest("span.marker")),root.find(currentFilteredItem).length<=0)return;const dragNo=this.getDragNo(currentFilteredItem),choiceNo=this.getChoiceNoFromElement(currentFilteredItem),listOfContainerToBeModifed=["div.draghomes .marker:not(.dragplaceholder).dragno"+dragNo+".choice"+choiceNo,"div.droparea .marker:not(.dragplaceholder).dragno"+dragNo+".choice"+choiceNo,"div.draghomes .marker:not(.dragplaceholder).infinite.choice"+choiceNo,"div.droparea .marker:not(.dragplaceholder).infinite.choice"+choiceNo];let listOfModifiedDragDrop=[];const filteredDragDropClone=currentFilteredItem.clone();listOfContainerToBeModifed.forEach((function(selector){root.find(selector).each((function(i,node){const originalClass=$(node).attr("class"),originalStyle=$(node).attr("style");filteredDragDropClone.attr("class",originalClass),filteredDragDropClone.attr("style",originalStyle),questionManager.addEventHandlersToMarker(filteredDragDropClone),$(node).before(filteredDragDropClone),listOfModifiedDragDrop.push(node)}))})),listOfModifiedDragDrop.forEach((function(node){$(node).remove()}))},DragDropMarkersQuestion.prototype.getNotYetLoadedImages=function(){return this.getRoot().find(".ddmarker img.dropbackground").not((function(i,imgNode){return this.imageIsLoaded(imgNode)}))},DragDropMarkersQuestion.prototype.imageIsLoaded=function(imgElement){return imgElement.complete&&0!==imgElement.naturalHeight};var questionManager={eventHandlersInitialised:!1,markerEventHandlersInitialised:{},isPrinting:!1,isKeyboardNavigation:!1,questions:{},init:function(containerId,readOnly,visibleDropZones){if(questionManager.questions[containerId]=new DragDropMarkersQuestion(containerId,readOnly,visibleDropZones),questionManager.eventHandlersInitialised||(questionManager.setupEventHandlers(),questionManager.eventHandlersInitialised=!0),!questionManager.markerEventHandlersInitialised.hasOwnProperty(containerId)){questionManager.markerEventHandlersInitialised[containerId]=!0;var questionContainer=document.getElementById(containerId);questionContainer.classList.contains("ddmarker")&&!questionContainer.classList.contains("qtype_ddmarker-readonly")&&(questionManager.addEventHandlersToMarker($(questionContainer).find("div.draghomes .marker")),questionManager.addEventHandlersToMarker($(questionContainer).find("div.droparea .marker")))}},setupEventHandlers:function(){$(window).on("resize",(function(){questionManager.handleWindowResize(!1)})),window.addEventListener("beforeprint",(function(){questionManager.isPrinting=!0,questionManager.handleWindowResize(questionManager.isPrinting)})),window.addEventListener("afterprint",(function(){questionManager.isPrinting=!1,questionManager.handleWindowResize(questionManager.isPrinting)})),setTimeout((function(){questionManager.fixLayoutIfThingsMoved()}),100)},addEventHandlersToMarker:function(element){element.on("mousedown touchstart",questionManager.handleDragStart).on("keydown keypress",questionManager.handleKeyPress).focusin((function(e){questionManager.handleKeyboardFocus(e,!0)})).focusout((function(e){questionManager.handleKeyboardFocus(e,!1)}))},handleDragStart:function(e){e.preventDefault();var question=questionManager.getQuestionForEvent(e);question&&question.handleDragStart(e)},handleKeyPress:function(e){var question=questionManager.getQuestionForEvent(e);question&&question.handleKeyPress(e)},handleWindowResize:function(isPrinting){for(var containerId in questionManager.questions)questionManager.questions.hasOwnProperty(containerId)&&(questionManager.questions[containerId].isPrinting=isPrinting,questionManager.questions[containerId].handleResize())},handleKeyboardFocus:function(e,isNavigating){questionManager.isKeyboardNavigation=isNavigating},fixLayoutIfThingsMoved:function(){questionManager.isKeyboardNavigation||this.handleWindowResize(questionManager.isPrinting),setTimeout((function(){questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting)}),100)},getQuestionForEvent:function(e){var containerId=$(e.currentTarget).closest(".que.ddmarker").attr("id");return questionManager.questions[containerId]},handleFormDirty:function(){const responseForm=document.getElementById("responseform");FormChangeChecker.markFormAsDirty(responseForm)}};return{init:questionManager.init}})); //# sourceMappingURL=question.min.js.map \ No newline at end of file diff --git a/question/type/ddmarker/amd/build/question.min.js.map b/question/type/ddmarker/amd/build/question.min.js.map index af6eaddfdb3..9bff37af094 100644 --- a/question/type/ddmarker/amd/build/question.min.js.map +++ b/question/type/ddmarker/amd/build/question.min.js.map @@ -1 +1 @@ -{"version":3,"file":"question.min.js","sources":["../src/question.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Question class for drag and drop marker question type, used to support the question and preview pages.\n *\n * @module qtype_ddmarker/question\n * @copyright 2018 The Open University\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\ndefine([\n 'jquery',\n 'core/dragdrop',\n 'qtype_ddmarker/shapes',\n 'core/key_codes',\n 'core_form/changechecker',\n 'core_filters/events',\n], function(\n $,\n dragDrop,\n Shapes,\n keys,\n FormChangeChecker,\n filterEvent\n) {\n\n \"use strict\";\n\n /**\n * Object to handle one drag-drop markers question.\n *\n * @param {String} containerId id of the outer div for this question.\n * @param {boolean} readOnly whether the question is being displayed read-only.\n * @param {Object[]} visibleDropZones the geometry of any drop-zones to show.\n * Objects have fields shape, coords and markertext.\n * @constructor\n */\n function DragDropMarkersQuestion(containerId, readOnly, visibleDropZones) {\n var thisQ = this;\n this.containerId = containerId;\n this.visibleDropZones = visibleDropZones;\n this.shapes = [];\n this.shapeSVGs = [];\n this.isPrinting = false;\n this.questionAnswer = {};\n if (readOnly) {\n this.getRoot().addClass('qtype_ddmarker-readonly');\n }\n thisQ.allImagesLoaded = false;\n thisQ.getNotYetLoadedImages().one('load', function() {\n thisQ.waitForAllImagesToBeLoaded();\n });\n thisQ.waitForAllImagesToBeLoaded();\n }\n\n /**\n * Draws the svg shapes of any drop zones that should be visible for feedback purposes.\n */\n DragDropMarkersQuestion.prototype.drawDropzones = function() {\n if (this.visibleDropZones.length > 0) {\n var bgImage = this.bgImage();\n\n this.getRoot().find('div.dropzones').html('');\n var svg = this.getRoot().find('svg.dropzones');\n\n var nextColourIndex = 0;\n for (var dropZoneNo = 0; dropZoneNo < this.visibleDropZones.length; dropZoneNo++) {\n var colourClass = 'color' + nextColourIndex;\n nextColourIndex = (nextColourIndex + 1) % 8;\n this.addDropzone(svg, dropZoneNo, colourClass);\n }\n }\n };\n\n /**\n * Adds a dropzone shape with colour, coords and link provided to the array of shapes.\n *\n * @param {jQuery} svg the SVG image to which to add this drop zone.\n * @param {int} dropZoneNo which drop-zone to add.\n * @param {string} colourClass class name\n */\n DragDropMarkersQuestion.prototype.addDropzone = function(svg, dropZoneNo, colourClass) {\n var dropZone = this.visibleDropZones[dropZoneNo],\n shape = Shapes.make(dropZone.shape, ''),\n existingmarkertext,\n bgRatio = this.bgRatio();\n if (!shape.parse(dropZone.coords, bgRatio)) {\n return;\n }\n\n existingmarkertext = this.getRoot().find('div.markertexts span.markertext' + dropZoneNo);\n if (existingmarkertext.length) {\n if (dropZone.markertext !== '') {\n existingmarkertext.html(dropZone.markertext);\n filterEvent.notifyFilterContentUpdated(existingmarkertext);\n } else {\n existingmarkertext.remove();\n }\n } else if (dropZone.markertext !== '') {\n var classnames = 'markertext markertext' + dropZoneNo;\n this.getRoot().find('div.markertexts').append('' +\n dropZone.markertext + '');\n var markerspan = this.getRoot().find('div.ddarea div.markertexts span.markertext' + dropZoneNo);\n if (markerspan.length) {\n var handles = shape.getHandlePositions();\n var positionLeft = handles.moveHandle.x - (markerspan.outerWidth() / 2) - 4;\n var positionTop = handles.moveHandle.y - (markerspan.outerHeight() / 2);\n markerspan\n .css('left', positionLeft)\n .css('top', positionTop);\n markerspan\n .data('originX', markerspan.position().left / bgRatio)\n .data('originY', markerspan.position().top / bgRatio);\n this.handleElementScale(markerspan, 'center');\n }\n filterEvent.notifyFilterContentUpdated(markerspan);\n }\n\n var shapeSVG = shape.makeSvg(svg[0]);\n shapeSVG.setAttribute('class', 'dropzone ' + colourClass);\n\n this.shapes[this.shapes.length] = shape;\n this.shapeSVGs[this.shapeSVGs.length] = shapeSVG;\n };\n\n /**\n * Draws the drag items on the page (and drop zones if required).\n * The idea is to re-draw all the drags and drops whenever there is a change\n * like a widow resize or an item dropped in place.\n */\n DragDropMarkersQuestion.prototype.repositionDrags = function() {\n var root = this.getRoot(),\n thisQ = this;\n\n root.find('div.draghomes .marker').not('.dragplaceholder').each(function(key, item) {\n $(item).addClass('unneeded');\n });\n\n root.find('input.choices').each(function(key, input) {\n var choiceNo = thisQ.getChoiceNoFromElement(input),\n imageCoords = thisQ.getImageCoords(input);\n if (imageCoords.length) {\n var drag = thisQ.getRoot().find('.draghomes' + ' span.marker' + '.choice' + choiceNo).not('.dragplaceholder');\n drag.remove();\n for (var i = 0; i < imageCoords.length; i++) {\n var dragInDrop = drag.clone();\n // Convert image coords to screen coords.\n const screenCoords = thisQ.convertToWindowXY(imageCoords[i]);\n dragInDrop.data('pagex', screenCoords.x).data('pagey', screenCoords.y);\n // Save image coords to the drag item so we can use it later.\n dragInDrop.data('imageCoords', imageCoords[i]);\n // We always save the coordinates in the 1:1 ratio.\n // So we need to set the scale ratio to 1 for the initial load.\n dragInDrop.data('scaleRatio', 1);\n thisQ.sendDragToDrop(dragInDrop, false, true);\n }\n thisQ.getDragClone(drag).addClass('active');\n thisQ.cloneDragIfNeeded(drag);\n }\n });\n\n // Save the question answer.\n thisQ.questionAnswer = thisQ.getQuestionAnsweredValues();\n };\n\n /**\n * Get the question answered values.\n *\n * @return {Object} Contain key-value with key is the input id and value is the input value.\n */\n DragDropMarkersQuestion.prototype.getQuestionAnsweredValues = function() {\n let result = {};\n this.getRoot().find('input.choices').each((i, inputNode) => {\n result[inputNode.id] = inputNode.value;\n });\n\n return result;\n };\n\n /**\n * Check if the question is being interacted or not.\n *\n * @return {boolean} Return true if the user has changed the question-answer.\n */\n DragDropMarkersQuestion.prototype.isQuestionInteracted = function() {\n const oldAnswer = this.questionAnswer;\n const newAnswer = this.getQuestionAnsweredValues();\n let isInteracted = false;\n\n // First, check both answers have the same structure or not.\n if (JSON.stringify(newAnswer) !== JSON.stringify(oldAnswer)) {\n isInteracted = true;\n return isInteracted;\n }\n // Check the values.\n Object.keys(newAnswer).forEach(key => {\n if (newAnswer[key] !== oldAnswer[key]) {\n isInteracted = true;\n }\n });\n\n return isInteracted;\n };\n\n /**\n * Determine what drag items need to be shown and\n * return coords of all drag items except any that are currently being dragged\n * based on contents of hidden inputs and whether drags are 'infinite' or how many\n * drags should be shown.\n *\n * @param {jQuery} inputNode\n * @returns {Point[]} image coordinates of however many copies of the drag item should be shown.\n */\n DragDropMarkersQuestion.prototype.getImageCoords = function(inputNode) {\n var imageCoords = [],\n val = $(inputNode).val();\n if (val !== '') {\n var coordsStrings = val.split(';');\n for (var i = 0; i < coordsStrings.length; i++) {\n imageCoords[i] = Shapes.Point.parse(coordsStrings[i]);\n }\n }\n return imageCoords;\n };\n\n /**\n * Converts the relative x and y position coordinates into\n * absolute x and y position coordinates.\n *\n * @param {Point} point relative to the background image.\n * @returns {Point} point relative to the page.\n */\n DragDropMarkersQuestion.prototype.convertToWindowXY = function(point) {\n var bgImage = this.bgImage();\n // The +1 seems rather odd, but seems to give the best results in\n // the three main browsers at a range of zoom levels.\n // (Its due to the 1px border around the image, that shifts the\n // image pixels by 1 down and to the left.)\n return point.offset(bgImage.offset().left + 1, bgImage.offset().top + 1);\n };\n\n /**\n * Utility function converting window coordinates to relative to the\n * background image coordinates.\n *\n * @param {Point} point relative to the page.\n * @returns {Point} point relative to the background image.\n */\n DragDropMarkersQuestion.prototype.convertToBgImgXY = function(point) {\n var bgImage = this.bgImage();\n return point.offset(-bgImage.offset().left - 1, -bgImage.offset().top - 1);\n };\n\n /**\n * Is the point within the background image?\n *\n * @param {Point} point relative to the BG image.\n * @return {boolean} true it they are.\n */\n DragDropMarkersQuestion.prototype.coordsInBgImg = function(point) {\n var bgImage = this.bgImage();\n var bgPosition = bgImage.offset();\n\n return point.x >= bgPosition.left && point.x < bgPosition.left + bgImage.width()\n && point.y >= bgPosition.top && point.y < bgPosition.top + bgImage.height();\n };\n\n /**\n * Get the outer div for this question.\n * @returns {jQuery} containing that div.\n */\n DragDropMarkersQuestion.prototype.getRoot = function() {\n return $(document.getElementById(this.containerId));\n };\n\n /**\n * Get the img that is the background image.\n * @returns {jQuery} containing that img.\n */\n DragDropMarkersQuestion.prototype.bgImage = function() {\n return this.getRoot().find('img.dropbackground');\n };\n\n DragDropMarkersQuestion.prototype.handleDragStart = function(e) {\n var thisQ = this,\n dragged = $(e.target).closest('.marker');\n\n var info = dragDrop.prepare(e);\n if (!info.start) {\n return;\n }\n\n dragged.addClass('beingdragged').css('transform', '');\n\n var placed = !dragged.hasClass('unneeded');\n if (!placed) {\n var hiddenDrag = thisQ.getDragClone(dragged);\n if (hiddenDrag.length) {\n hiddenDrag.addClass('active');\n dragged.offset(hiddenDrag.offset());\n }\n }\n\n dragDrop.start(e, dragged, function() {\n void (1);\n }, function(x, y, dragged) {\n thisQ.dragEnd(dragged);\n });\n };\n\n /**\n * Functionality at the end of a drag drop.\n * @param {jQuery} dragged the marker that was dragged.\n */\n DragDropMarkersQuestion.prototype.dragEnd = function(dragged) {\n var placed = false,\n choiceNo = this.getChoiceNoFromElement(dragged),\n bgRatio = this.bgRatio(),\n dragXY;\n\n dragged.data('pagex', dragged.offset().left).data('pagey', dragged.offset().top);\n dragXY = new Shapes.Point(dragged.data('pagex'), dragged.data('pagey'));\n if (this.coordsInBgImg(dragXY)) {\n this.sendDragToDrop(dragged, true);\n placed = true;\n // Since we already move the drag item to new position.\n // Remove the image coords if this drag item have it.\n // We will get the new image coords for this drag item in saveCoordsForChoice.\n if (dragged.data('imageCoords')) {\n dragged.data('imageCoords', null);\n }\n // It seems that the dragdrop sometimes leaves the drag\n // one pixel out of position. Put it in exactly the right place.\n var bgImgXY = this.convertToBgImgXY(dragXY);\n bgImgXY = new Shapes.Point(bgImgXY.x / bgRatio, bgImgXY.y / bgRatio);\n dragged.data('originX', bgImgXY.x).data('originY', bgImgXY.y);\n }\n\n if (!placed) {\n this.sendDragHome(dragged);\n this.removeDragIfNeeded(dragged);\n } else {\n this.cloneDragIfNeeded(dragged);\n }\n\n this.saveCoordsForChoice(choiceNo);\n };\n\n /**\n * Save the coordinates for a dropped item in the form field.\n * @param {Number} choiceNo which copy of the choice this was.\n */\n DragDropMarkersQuestion.prototype.saveCoordsForChoice = function(choiceNo) {\n let imageCoords = [];\n var items = this.getRoot().find('div.droparea span.marker.choice' + choiceNo),\n thiQ = this,\n bgRatio = this.bgRatio();\n\n if (items.length) {\n items.each(function() {\n var drag = $(this);\n if (!drag.hasClass('beingdragged') && !drag.data('imageCoords')) {\n if (drag.data('scaleRatio') !== bgRatio) {\n // The scale ratio for the draggable item was changed. We need to update that.\n drag.data('pagex', drag.offset().left).data('pagey', drag.offset().top);\n }\n var dragXY = new Shapes.Point(drag.data('pagex'), drag.data('pagey'));\n if (thiQ.coordsInBgImg(dragXY)) {\n var bgImgXY = thiQ.convertToBgImgXY(dragXY);\n bgImgXY = new Shapes.Point(bgImgXY.x / bgRatio, bgImgXY.y / bgRatio);\n imageCoords[imageCoords.length] = bgImgXY;\n }\n } else if (drag.data('imageCoords')) {\n imageCoords[imageCoords.length] = drag.data('imageCoords');\n }\n });\n }\n\n this.getRoot().find('input.choice' + choiceNo).val(imageCoords.join(';'));\n if (this.isQuestionInteracted()) {\n // The user has interacted with the draggable items. We need to mark the form as dirty.\n questionManager.handleFormDirty();\n // Save the new answered value.\n this.questionAnswer = this.getQuestionAnsweredValues();\n }\n };\n\n /**\n * Handle key down / press events on markers.\n * @param {KeyboardEvent} e\n */\n DragDropMarkersQuestion.prototype.handleKeyPress = function(e) {\n var drag = $(e.target).closest('.marker'),\n point = new Shapes.Point(drag.offset().left, drag.offset().top),\n choiceNo = this.getChoiceNoFromElement(drag);\n\n switch (e.keyCode) {\n case keys.arrowLeft:\n case 65: // A.\n point.x -= 1;\n break;\n case keys.arrowRight:\n case 68: // D.\n point.x += 1;\n break;\n case keys.arrowDown:\n case 83: // S.\n point.y += 1;\n break;\n case keys.arrowUp:\n case 87: // W.\n point.y -= 1;\n break;\n case keys.space:\n case keys.escape:\n point = null;\n break;\n default:\n return; // Ingore other keys.\n }\n e.preventDefault();\n\n if (point !== null) {\n point = this.constrainToBgImg(point);\n drag.offset({'left': point.x, 'top': point.y});\n drag.data('pagex', drag.offset().left).data('pagey', drag.offset().top);\n var dragXY = this.convertToBgImgXY(new Shapes.Point(drag.data('pagex'), drag.data('pagey')));\n drag.data('originX', dragXY.x / this.bgRatio()).data('originY', dragXY.y / this.bgRatio());\n if (this.coordsInBgImg(new Shapes.Point(drag.offset().left, drag.offset().top))) {\n if (drag.hasClass('unneeded')) {\n this.sendDragToDrop(drag, true);\n var hiddenDrag = this.getDragClone(drag);\n if (hiddenDrag.length) {\n hiddenDrag.addClass('active');\n }\n this.cloneDragIfNeeded(drag);\n }\n }\n } else {\n drag.css('left', '').css('top', '');\n drag.data('pagex', drag.offset().left).data('pagey', drag.offset().top);\n this.sendDragHome(drag);\n this.removeDragIfNeeded(drag);\n }\n drag.focus();\n this.saveCoordsForChoice(choiceNo);\n };\n\n /**\n * Makes sure the dragged item always exists within the background image area.\n *\n * @param {Point} windowxy\n * @returns {Point} coordinates\n */\n DragDropMarkersQuestion.prototype.constrainToBgImg = function(windowxy) {\n var bgImg = this.bgImage(),\n bgImgXY = this.convertToBgImgXY(windowxy);\n bgImgXY.x = Math.max(0, bgImgXY.x);\n bgImgXY.y = Math.max(0, bgImgXY.y);\n bgImgXY.x = Math.min(bgImg.width(), bgImgXY.x);\n bgImgXY.y = Math.min(bgImg.height(), bgImgXY.y);\n return this.convertToWindowXY(bgImgXY);\n };\n\n /**\n * Returns the choice number for a node.\n *\n * @param {Element|jQuery} node\n * @returns {Number}\n */\n DragDropMarkersQuestion.prototype.getChoiceNoFromElement = function(node) {\n return Number(this.getClassnameNumericSuffix(node, 'choice'));\n };\n\n /**\n * Returns the numeric part of a class with the given prefix.\n *\n * @param {Element|jQuery} node\n * @param {String} prefix\n * @returns {Number|null}\n */\n DragDropMarkersQuestion.prototype.getClassnameNumericSuffix = function(node, prefix) {\n var classes = $(node).attr('class');\n if (classes !== undefined && classes !== '') {\n var classesarr = classes.split(' ');\n for (var index = 0; index < classesarr.length; index++) {\n var patt1 = new RegExp('^' + prefix + '([0-9])+$');\n if (patt1.test(classesarr[index])) {\n var patt2 = new RegExp('([0-9])+$');\n var match = patt2.exec(classesarr[index]);\n return Number(match[0]);\n }\n }\n }\n return null;\n };\n\n /**\n * Handle when the window is resized.\n */\n DragDropMarkersQuestion.prototype.handleResize = function() {\n var thisQ = this,\n bgRatio = this.bgRatio();\n if (this.isPrinting) {\n bgRatio = 1;\n }\n\n this.getRoot().find('div.droparea .marker').not('.beingdragged').each(function(key, drag) {\n $(drag)\n .css('left', parseFloat($(drag).data('originX')) * parseFloat(bgRatio))\n .css('top', parseFloat($(drag).data('originY')) * parseFloat(bgRatio));\n thisQ.handleElementScale(drag, 'left top');\n });\n\n this.getRoot().find('div.droparea svg.dropzones')\n .width(this.bgImage().width())\n .height(this.bgImage().height());\n\n for (var dropZoneNo = 0; dropZoneNo < this.visibleDropZones.length; dropZoneNo++) {\n var dropZone = thisQ.visibleDropZones[dropZoneNo];\n var originCoords = dropZone.coords;\n var shape = thisQ.shapes[dropZoneNo];\n var shapeSVG = thisQ.shapeSVGs[dropZoneNo];\n shape.parse(originCoords, bgRatio);\n shape.updateSvg(shapeSVG);\n\n var handles = shape.getHandlePositions();\n var markerSpan = this.getRoot().find('div.ddarea div.markertexts span.markertext' + dropZoneNo);\n markerSpan\n .css('left', handles.moveHandle.x - (markerSpan.outerWidth() / 2) - 4)\n .css('top', handles.moveHandle.y - (markerSpan.outerHeight() / 2));\n thisQ.handleElementScale(markerSpan, 'center');\n }\n };\n\n /**\n * Clone the drag.\n */\n DragDropMarkersQuestion.prototype.cloneDrags = function() {\n var thisQ = this;\n this.getRoot().find('div.draghomes span.marker').each(function(index, draghome) {\n var drag = $(draghome);\n var placeHolder = drag.clone();\n placeHolder.removeClass();\n placeHolder.addClass('marker');\n placeHolder.addClass('choice' + thisQ.getChoiceNoFromElement(drag));\n placeHolder.addClass(thisQ.getDragNoClass(drag, false));\n placeHolder.addClass('dragplaceholder');\n drag.before(placeHolder);\n });\n };\n\n /**\n * Get the drag number of a drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {Number} the drag number.\n */\n DragDropMarkersQuestion.prototype.getDragNo = function(drag) {\n return this.getClassnameNumericSuffix(drag, 'dragno');\n };\n\n /**\n * Get the drag number prefix of a drag.\n *\n * @param {jQuery} drag the drag.\n * @param {Boolean} includeSelector include the CSS selector prefix or not.\n * @return {String} Class name\n */\n DragDropMarkersQuestion.prototype.getDragNoClass = function(drag, includeSelector) {\n var className = 'dragno' + this.getDragNo(drag);\n if (this.isInfiniteDrag(drag)) {\n className = 'infinite';\n }\n\n if (includeSelector) {\n return '.' + className;\n }\n\n return className;\n };\n\n /**\n * Get drag clone for a given drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {jQuery} the drag's clone.\n */\n DragDropMarkersQuestion.prototype.getDragClone = function(drag) {\n return this.getRoot().find('.draghomes' + ' span.marker' +\n '.choice' + this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true) + '.dragplaceholder');\n };\n\n /**\n * Get the drop area element.\n * @returns {jQuery} droparea element.\n */\n DragDropMarkersQuestion.prototype.dropArea = function() {\n return this.getRoot().find('div.droparea');\n };\n\n /**\n * Animate a drag back to its home.\n *\n * @param {jQuery} drag the item being moved.\n */\n DragDropMarkersQuestion.prototype.sendDragHome = function(drag) {\n drag.removeClass('beingdragged')\n .addClass('unneeded')\n .css('top', '')\n .css('left', '')\n .css('transform', '');\n var placeHolder = this.getDragClone(drag);\n placeHolder.after(drag);\n placeHolder.removeClass('active');\n };\n\n /**\n * Animate a drag item into a given place.\n *\n * @param {jQuery} drag the item to place.\n * @param {boolean} isScaling Scaling or not.\n * @param {boolean} initialLoad Whether it is the initial load or not.\n */\n DragDropMarkersQuestion.prototype.sendDragToDrop = function(drag, isScaling, initialLoad = false) {\n var dropArea = this.dropArea(),\n bgRatio = this.bgRatio();\n drag.removeClass('beingdragged').removeClass('unneeded');\n var dragXY = this.convertToBgImgXY(new Shapes.Point(drag.data('pagex'), drag.data('pagey')));\n if (isScaling) {\n drag.data('originX', dragXY.x / bgRatio).data('originY', dragXY.y / bgRatio);\n drag.css('left', dragXY.x).css('top', dragXY.y);\n } else {\n drag.data('originX', dragXY.x).data('originY', dragXY.y);\n drag.css('left', dragXY.x * bgRatio).css('top', dragXY.y * bgRatio);\n }\n // We need to save the original scale ratio for each draggable item.\n if (!initialLoad) {\n // Only set the scale ratio for a current being-dragged item, not for the initial loading.\n drag.data('scaleRatio', bgRatio);\n }\n dropArea.append(drag);\n this.handleElementScale(drag, 'left top');\n };\n\n /**\n * Clone the drag at the draghome area if needed.\n *\n * @param {jQuery} drag the item to place.\n */\n DragDropMarkersQuestion.prototype.cloneDragIfNeeded = function(drag) {\n var inputNode = this.getInput(drag),\n noOfDrags = Number(this.getClassnameNumericSuffix(inputNode, 'noofdrags')),\n displayedDragsInDropArea = this.getRoot().find('div.droparea .marker.choice' +\n this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true)).length,\n displayedDragsInDragHomes = this.getRoot().find('div.draghomes .marker.choice' +\n this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true)).not('.dragplaceholder').length;\n\n if ((this.isInfiniteDrag(drag) ||\n !this.isInfiniteDrag(drag) && displayedDragsInDropArea < noOfDrags) && displayedDragsInDragHomes === 0) {\n var dragClone = drag.clone();\n dragClone.addClass('unneeded')\n .css('top', '')\n .css('left', '')\n .css('transform', '');\n this.getDragClone(drag)\n .removeClass('active')\n .after(dragClone);\n questionManager.addEventHandlersToMarker(dragClone);\n }\n };\n\n /**\n * Remove the clone drag at the draghome area if needed.\n *\n * @param {jQuery} drag the item to place.\n */\n DragDropMarkersQuestion.prototype.removeDragIfNeeded = function(drag) {\n var dragsInHome = this.getRoot().find('div.draghomes .marker.choice' +\n this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true)).not('.dragplaceholder');\n var displayedDrags = dragsInHome.length;\n while (displayedDrags > 1) {\n dragsInHome.first().remove();\n displayedDrags--;\n }\n };\n\n /**\n * Get the input belong to drag.\n *\n * @param {jQuery} drag the item to place.\n * @returns {jQuery} input element.\n */\n DragDropMarkersQuestion.prototype.getInput = function(drag) {\n var choiceNo = this.getChoiceNoFromElement(drag);\n return this.getRoot().find('input.choices.choice' + choiceNo);\n };\n\n /**\n * Return the background ratio.\n *\n * @returns {number} Background ratio.\n */\n DragDropMarkersQuestion.prototype.bgRatio = function() {\n var bgImg = this.bgImage();\n var bgImgNaturalWidth = bgImg.get(0).naturalWidth;\n var bgImgClientWidth = bgImg.width();\n\n return bgImgClientWidth / bgImgNaturalWidth;\n };\n\n /**\n * Scale the drag if needed.\n *\n * @param {jQuery} element the item to place.\n * @param {String} type scaling type\n */\n DragDropMarkersQuestion.prototype.handleElementScale = function(element, type) {\n var bgRatio = parseFloat(this.bgRatio());\n if (this.isPrinting) {\n bgRatio = 1;\n }\n $(element).css({\n '-webkit-transform': 'scale(' + bgRatio + ')',\n '-moz-transform': 'scale(' + bgRatio + ')',\n '-ms-transform': 'scale(' + bgRatio + ')',\n '-o-transform': 'scale(' + bgRatio + ')',\n 'transform': 'scale(' + bgRatio + ')',\n 'transform-origin': type\n });\n };\n\n /**\n * Check if the given drag is in infinite mode or not.\n *\n * @param {jQuery} drag The drag item need to check.\n */\n DragDropMarkersQuestion.prototype.isInfiniteDrag = function(drag) {\n return drag.hasClass('infinite');\n };\n\n /**\n * Waits until all images are loaded before calling setupQuestion().\n *\n * This function is called from the onLoad of each image, and also polls with\n * a time-out, because image on-loads are allegedly unreliable.\n */\n DragDropMarkersQuestion.prototype.waitForAllImagesToBeLoaded = function() {\n var thisQ = this;\n // This method may get called multiple times (via image on-loads or timeouts.\n // If we are already done, don't do it again.\n if (this.allImagesLoaded) {\n return;\n }\n\n // Clear any current timeout, if set.\n if (this.imageLoadingTimeoutId !== null) {\n clearTimeout(this.imageLoadingTimeoutId);\n }\n\n // If we have not yet loaded all images, set a timeout to\n // call ourselves again, since apparently images on-load\n // events are flakey.\n if (this.getNotYetLoadedImages().length > 0) {\n this.imageLoadingTimeoutId = setTimeout(function() {\n this.waitForAllImagesToBeLoaded();\n }, 100);\n return;\n }\n\n // We now have all images. Carry on, but only after giving the layout a chance to settle down.\n this.allImagesLoaded = true;\n this.cloneDrags();\n this.repositionDrags();\n this.drawDropzones();\n // Wait for all dynamic content loaded by filter to be completed.\n document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete, (elements) => {\n elements.detail.nodes.forEach((element) => {\n thisQ.changeAllMakerToFilteredContent(element);\n });\n });\n };\n\n /**\n * Change all the maker related to the item that has been changed by filter to correct size and content.\n *\n * @param {object} filteredElement the element has been modified by filter.\n */\n DragDropMarkersQuestion.prototype.changeAllMakerToFilteredContent = function(filteredElement) {\n let currentFilteredItem = $(filteredElement);\n const parentIsMarker = currentFilteredItem.parent().closest('span.marker');\n const isMarker = currentFilteredItem.hasClass('marker');\n const root = this.getRoot();\n // The filtered element or parent element should a drag or drop item.\n if (!parentIsMarker && !isMarker) {\n return;\n }\n if (parentIsMarker) {\n currentFilteredItem = currentFilteredItem.parent().closest('span.marker');\n }\n if (root.find(currentFilteredItem).length <= 0) {\n // If the maker doesn't belong to this question\n // In case we have multiple questions in the same page.\n return;\n }\n const dragNo = this.getDragNo(currentFilteredItem);\n const choiceNo = this.getChoiceNoFromElement(currentFilteredItem);\n const listOfContainerToBeModifed = [\n 'div.draghomes .marker:not(.dragplaceholder).dragno' + dragNo + '.choice' + choiceNo,\n 'div.droparea .marker:not(.dragplaceholder).dragno' + dragNo + '.choice' + choiceNo,\n 'div.draghomes .marker:not(.dragplaceholder).infinite.choice' + choiceNo,\n 'div.droparea .marker:not(.dragplaceholder).infinite.choice' + choiceNo\n ];\n let listOfModifiedDragDrop = [];\n // We want to keep all the handler and event for filtered item, so using clone is the only choice.\n const filteredDragDropClone = currentFilteredItem.clone();\n listOfContainerToBeModifed.forEach(function(selector) {\n root.find(selector).each(function(i, node) {\n const originalClass = $(node).attr('class');\n const originalStyle = $(node).attr('style');\n // Replace the class and style of the maker we want to replace for the clone.\n filteredDragDropClone.attr('class', originalClass);\n filteredDragDropClone.attr('style', originalStyle);\n // Add event for the clone.\n questionManager.addEventHandlersToMarker(filteredDragDropClone);\n // Insert into DOM.\n $(node).before(filteredDragDropClone);\n listOfModifiedDragDrop.push(node);\n });\n });\n listOfModifiedDragDrop.forEach(function(node) {\n $(node).remove();\n });\n };\n\n /**\n * Get any of the images in the drag-drop area that are not yet fully loaded.\n *\n * @returns {jQuery} those images.\n */\n DragDropMarkersQuestion.prototype.getNotYetLoadedImages = function() {\n return this.getRoot().find('.ddmarker img.dropbackground').not(function(i, imgNode) {\n return this.imageIsLoaded(imgNode);\n });\n };\n\n /**\n * Check if an image has loaded without errors.\n *\n * @param {HTMLImageElement} imgElement an image.\n * @returns {boolean} true if this image has loaded without errors.\n */\n DragDropMarkersQuestion.prototype.imageIsLoaded = function(imgElement) {\n return imgElement.complete && imgElement.naturalHeight !== 0;\n };\n\n /**\n * Singleton that tracks all the DragDropToTextQuestions on this page, and deals\n * with event dispatching.\n *\n * @type {Object}\n */\n var questionManager = {\n\n /**\n * {boolean} ensures that the event handlers are only initialised once per page.\n */\n eventHandlersInitialised: false,\n\n /**\n * {Object} ensures that the marker event handlers are only initialised once per question,\n * indexed by containerId (id on the .que div).\n */\n markerEventHandlersInitialised: {},\n\n /**\n * {boolean} is printing or not.\n */\n isPrinting: false,\n\n /**\n * {boolean} is keyboard navigation.\n */\n isKeyboardNavigation: false,\n\n /**\n * {Object} all the questions on this page, indexed by containerId (id on the .que div).\n */\n questions: {}, // An object containing all the information about each question on the page.\n\n /**\n * Initialise one question.\n *\n * @param {String} containerId the id of the div.que that contains this question.\n * @param {boolean} readOnly whether the question is read-only.\n */\n init: function(containerId, readOnly) {\n const visibleDropZones = JSON.parse(document.querySelector('#' + containerId + ' .dropzones')\n .dataset.visibledDropzones);\n questionManager.questions[containerId] =\n new DragDropMarkersQuestion(containerId, readOnly, visibleDropZones);\n if (!questionManager.eventHandlersInitialised) {\n questionManager.setupEventHandlers();\n questionManager.eventHandlersInitialised = true;\n }\n if (!questionManager.markerEventHandlersInitialised.hasOwnProperty(containerId)) {\n questionManager.markerEventHandlersInitialised[containerId] = true;\n // We do not use the body event here to prevent the other event on Mobile device, such as scroll event.\n var questionContainer = document.getElementById(containerId);\n if (questionContainer.classList.contains('ddmarker') &&\n !questionContainer.classList.contains('qtype_ddmarker-readonly')) {\n // TODO: Convert all the jQuery selectors and events to native Javascript.\n questionManager.addEventHandlersToMarker($(questionContainer).find('div.draghomes .marker'));\n questionManager.addEventHandlersToMarker($(questionContainer).find('div.droparea .marker'));\n }\n }\n },\n\n /**\n * Set up the event handlers that make this question type work. (Done once per page.)\n */\n setupEventHandlers: function() {\n $(window).on('resize', function() {\n questionManager.handleWindowResize(false);\n });\n window.addEventListener('beforeprint', function() {\n questionManager.isPrinting = true;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n window.addEventListener('afterprint', function() {\n questionManager.isPrinting = false;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved();\n }, 100);\n },\n\n /**\n * Binding the event again for newly created element.\n *\n * @param {jQuery} element Element to bind the event\n */\n addEventHandlersToMarker: function(element) {\n element\n .on('mousedown touchstart', questionManager.handleDragStart)\n .on('keydown keypress', questionManager.handleKeyPress)\n .focusin(function(e) {\n questionManager.handleKeyboardFocus(e, true);\n })\n .focusout(function(e) {\n questionManager.handleKeyboardFocus(e, false);\n });\n },\n\n /**\n * Handle mouse down / touch start events on markers.\n * @param {Event} e the DOM event.\n */\n handleDragStart: function(e) {\n e.preventDefault();\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleDragStart(e);\n }\n },\n\n /**\n * Handle key down / press events on markers.\n * @param {Event} e\n */\n handleKeyPress: function(e) {\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleKeyPress(e);\n }\n },\n\n /**\n * Handle when the window is resized.\n * @param {boolean} isPrinting\n */\n handleWindowResize: function(isPrinting) {\n for (var containerId in questionManager.questions) {\n if (questionManager.questions.hasOwnProperty(containerId)) {\n questionManager.questions[containerId].isPrinting = isPrinting;\n questionManager.questions[containerId].handleResize();\n }\n }\n },\n\n /**\n * Handle focus lost events on markers.\n * @param {Event} e\n * @param {boolean} isNavigating\n */\n handleKeyboardFocus: function(e, isNavigating) {\n questionManager.isKeyboardNavigation = isNavigating;\n },\n\n /**\n * Sometimes, despite our best efforts, things change in a way that cannot\n * be specifically caught (e.g. dock expanding or collapsing in Boost).\n * Therefore, we need to periodically check everything is in the right position.\n */\n fixLayoutIfThingsMoved: function() {\n if (!questionManager.isKeyboardNavigation) {\n this.handleWindowResize(questionManager.isPrinting);\n }\n // We use setTimeout after finishing work, rather than setInterval,\n // in case positioning things is slow. We want 100 ms gap\n // between executions, not what setInterval does.\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting);\n }, 100);\n },\n\n /**\n * Given an event, work out which question it effects.\n * @param {Event} e the event.\n * @returns {DragDropMarkersQuestion|undefined} The question, or undefined.\n */\n getQuestionForEvent: function(e) {\n var containerId = $(e.currentTarget).closest('.que.ddmarker').attr('id');\n return questionManager.questions[containerId];\n },\n\n /**\n * Handle when the form is dirty.\n */\n handleFormDirty: function() {\n const responseForm = document.getElementById('responseform');\n FormChangeChecker.markFormAsDirty(responseForm);\n }\n };\n\n /**\n * @alias module:qtype_ddmarker/question\n */\n return {\n /**\n * Initialise one drag-drop markers question.\n *\n * @param {String} containerId id of the outer div for this question.\n * @param {String} bgImgUrl the URL of the background image.\n * @param {boolean} readOnly whether the question is being displayed read-only.\n * @param {String[]} visibleDropZones the geometry of any drop-zones to show.\n */\n init: questionManager.init\n };\n});\n"],"names":["define","$","dragDrop","Shapes","keys","FormChangeChecker","filterEvent","DragDropMarkersQuestion","containerId","readOnly","visibleDropZones","thisQ","this","shapes","shapeSVGs","isPrinting","questionAnswer","getRoot","addClass","allImagesLoaded","getNotYetLoadedImages","one","waitForAllImagesToBeLoaded","prototype","drawDropzones","length","bgImage","find","html","outerWidth","outerHeight","svg","nextColourIndex","dropZoneNo","colourClass","addDropzone","existingmarkertext","dropZone","shape","make","bgRatio","parse","coords","markertext","notifyFilterContentUpdated","remove","classnames","append","markerspan","handles","getHandlePositions","positionLeft","moveHandle","x","positionTop","y","css","data","position","left","top","handleElementScale","shapeSVG","makeSvg","setAttribute","repositionDrags","root","not","each","key","item","input","choiceNo","getChoiceNoFromElement","imageCoords","getImageCoords","drag","i","dragInDrop","clone","screenCoords","convertToWindowXY","sendDragToDrop","getDragClone","cloneDragIfNeeded","getQuestionAnsweredValues","result","inputNode","id","value","isQuestionInteracted","oldAnswer","newAnswer","isInteracted","JSON","stringify","Object","forEach","val","coordsStrings","split","Point","point","offset","convertToBgImgXY","coordsInBgImg","bgPosition","width","height","document","getElementById","handleDragStart","e","dragged","target","closest","prepare","start","hasClass","hiddenDrag","dragEnd","dragXY","placed","bgImgXY","sendDragHome","removeDragIfNeeded","saveCoordsForChoice","items","thiQ","join","questionManager","handleFormDirty","handleKeyPress","keyCode","arrowLeft","arrowRight","arrowDown","arrowUp","space","escape","preventDefault","constrainToBgImg","focus","windowxy","bgImg","Math","max","min","node","Number","getClassnameNumericSuffix","prefix","classes","attr","undefined","classesarr","index","RegExp","test","match","exec","handleResize","parseFloat","originCoords","updateSvg","markerSpan","cloneDrags","draghome","placeHolder","removeClass","getDragNoClass","before","getDragNo","includeSelector","className","isInfiniteDrag","dropArea","after","isScaling","initialLoad","getInput","noOfDrags","displayedDragsInDropArea","displayedDragsInDragHomes","dragClone","addEventHandlersToMarker","dragsInHome","displayedDrags","first","bgImgNaturalWidth","get","naturalWidth","element","type","imageLoadingTimeoutId","clearTimeout","setTimeout","addEventListener","eventTypes","filterContentRenderingComplete","elements","detail","nodes","changeAllMakerToFilteredContent","filteredElement","currentFilteredItem","parentIsMarker","parent","isMarker","dragNo","listOfContainerToBeModifed","listOfModifiedDragDrop","filteredDragDropClone","selector","originalClass","originalStyle","push","imgNode","imageIsLoaded","imgElement","complete","naturalHeight","eventHandlersInitialised","markerEventHandlersInitialised","isKeyboardNavigation","questions","init","querySelector","dataset","visibledDropzones","setupEventHandlers","hasOwnProperty","questionContainer","classList","contains","window","on","handleWindowResize","fixLayoutIfThingsMoved","focusin","handleKeyboardFocus","focusout","question","getQuestionForEvent","isNavigating","currentTarget","responseForm","markFormAsDirty"],"mappings":";;;;;;;AAuBAA,iCAAO,CACH,SACA,gBACA,wBACA,iBACA,0BACA,wBACD,SACCC,EACAC,SACAC,OACAC,KACAC,kBACAC,sBAcSC,wBAAwBC,YAAaC,SAAUC,sBAChDC,MAAQC,UACPJ,YAAcA,iBACdE,iBAAmBA,sBACnBG,OAAS,QACTC,UAAY,QACZC,YAAa,OACbC,eAAiB,GAClBP,eACKQ,UAAUC,SAAS,2BAE5BP,MAAMQ,iBAAkB,EACxBR,MAAMS,wBAAwBC,IAAI,QAAQ,WACtCV,MAAMW,gCAEVX,MAAMW,6BAMVf,wBAAwBgB,UAAUC,cAAgB,cAC1CZ,KAAKF,iBAAiBe,OAAS,EAAG,KAC9BC,QAAUd,KAAKc,eAEdT,UAAUU,KAAK,iBAAiBC,KAAK,oEAC1BF,QAAQG,aADkB,aAEzBH,QAAQI,cAAgB,oBACrCC,IAAMnB,KAAKK,UAAUU,KAAK,iBAE1BK,gBAAkB,EACbC,WAAa,EAAGA,WAAarB,KAAKF,iBAAiBe,OAAQQ,aAAc,KAC1EC,YAAc,QAAUF,gBAC5BA,iBAAmBA,gBAAkB,GAAK,OACrCG,YAAYJ,IAAKE,WAAYC,gBAY9C3B,wBAAwBgB,UAAUY,YAAc,SAASJ,IAAKE,WAAYC,iBAGlEE,mBAFAC,SAAWzB,KAAKF,iBAAiBuB,YACjCK,MAAQnC,OAAOoC,KAAKF,SAASC,MAAO,IAEpCE,QAAU5B,KAAK4B,aACdF,MAAMG,MAAMJ,SAASK,OAAQF,cAIlCJ,mBAAqBxB,KAAKK,UAAUU,KAAK,kCAAoCM,aACtDR,OACS,KAAxBY,SAASM,YACTP,mBAAmBR,KAAKS,SAASM,YACjCrC,YAAYsC,2BAA2BR,qBAEvCA,mBAAmBS,cAEpB,GAA4B,KAAxBR,SAASM,WAAmB,KAC/BG,WAAa,wBAA0Bb,gBACtChB,UAAUU,KAAK,mBAAmBoB,OAAO,gBAAkBD,WAAa,KACzET,SAASM,WAAa,eACtBK,WAAapC,KAAKK,UAAUU,KAAK,6CAA+CM,eAChFe,WAAWvB,OAAQ,KACfwB,QAAUX,MAAMY,qBAChBC,aAAeF,QAAQG,WAAWC,EAAKL,WAAWnB,aAAe,EAAK,EACtEyB,YAAcL,QAAQG,WAAWG,EAAKP,WAAWlB,cAAgB,EACrEkB,WACKQ,IAAI,OAAQL,cACZK,IAAI,MAAOF,aAChBN,WACKS,KAAK,UAAWT,WAAWU,WAAWC,KAAOnB,SAC7CiB,KAAK,UAAWT,WAAWU,WAAWE,IAAMpB,cAC5CqB,mBAAmBb,WAAY,UAExC1C,YAAYsC,2BAA2BI,gBAGvCc,SAAWxB,MAAMyB,QAAQhC,IAAI,IACjC+B,SAASE,aAAa,QAAS,YAAc9B,kBAExCrB,OAAOD,KAAKC,OAAOY,QAAUa,WAC7BxB,UAAUF,KAAKE,UAAUW,QAAUqC,WAQ5CvD,wBAAwBgB,UAAU0C,gBAAkB,eAC5CC,KAAOtD,KAAKK,UACZN,MAAQC,KAEZsD,KAAKvC,KAAK,yBAAyBwC,IAAI,oBAAoBC,MAAK,SAASC,IAAKC,MAC1ErE,EAAEqE,MAAMpD,SAAS,eAGrBgD,KAAKvC,KAAK,iBAAiByC,MAAK,SAASC,IAAKE,WACtCC,SAAW7D,MAAM8D,uBAAuBF,OACxCG,YAAc/D,MAAMgE,eAAeJ,UACnCG,YAAYjD,OAAQ,KAChBmD,KAAOjE,MAAMM,UAAUU,KAAK,gCAA4C6C,UAAUL,IAAI,oBAC1FS,KAAK/B,aACA,IAAIgC,EAAI,EAAGA,EAAIH,YAAYjD,OAAQoD,IAAK,KACrCC,WAAaF,KAAKG,cAEhBC,aAAerE,MAAMsE,kBAAkBP,YAAYG,IACzDC,WAAWrB,KAAK,QAASuB,aAAa3B,GAAGI,KAAK,QAASuB,aAAazB,GAEpEuB,WAAWrB,KAAK,cAAeiB,YAAYG,IAG3CC,WAAWrB,KAAK,aAAc,GAC9B9C,MAAMuE,eAAeJ,YAAY,GAAO,GAE5CnE,MAAMwE,aAAaP,MAAM1D,SAAS,UAClCP,MAAMyE,kBAAkBR,UAKhCjE,MAAMK,eAAiBL,MAAM0E,6BAQjC9E,wBAAwBgB,UAAU8D,0BAA4B,eACtDC,OAAS,eACRrE,UAAUU,KAAK,iBAAiByC,MAAK,CAACS,EAAGU,aAC1CD,OAAOC,UAAUC,IAAMD,UAAUE,SAG9BH,QAQX/E,wBAAwBgB,UAAUmE,qBAAuB,iBAC/CC,UAAY/E,KAAKI,eACjB4E,UAAYhF,KAAKyE,gCACnBQ,cAAe,SAGfC,KAAKC,UAAUH,aAAeE,KAAKC,UAAUJ,YAC7CE,cAAe,EACRA,eAGXG,OAAO5F,KAAKwF,WAAWK,SAAQ5B,MACvBuB,UAAUvB,OAASsB,UAAUtB,OAC7BwB,cAAe,MAIhBA,eAYXtF,wBAAwBgB,UAAUoD,eAAiB,SAASY,eACpDb,YAAc,GACdwB,IAAMjG,EAAEsF,WAAWW,SACX,KAARA,YACIC,cAAgBD,IAAIE,MAAM,KACrBvB,EAAI,EAAGA,EAAIsB,cAAc1E,OAAQoD,IACtCH,YAAYG,GAAK1E,OAAOkG,MAAM5D,MAAM0D,cAActB,WAGnDH,aAUXnE,wBAAwBgB,UAAU0D,kBAAoB,SAASqB,WACvD5E,QAAUd,KAAKc,iBAKZ4E,MAAMC,OAAO7E,QAAQ6E,SAAS5C,KAAO,EAAGjC,QAAQ6E,SAAS3C,IAAM,IAU1ErD,wBAAwBgB,UAAUiF,iBAAmB,SAASF,WACtD5E,QAAUd,KAAKc,iBACZ4E,MAAMC,QAAQ7E,QAAQ6E,SAAS5C,KAAO,GAAIjC,QAAQ6E,SAAS3C,IAAM,IAS5ErD,wBAAwBgB,UAAUkF,cAAgB,SAASH,WACnD5E,QAAUd,KAAKc,UACfgF,WAAahF,QAAQ6E,gBAElBD,MAAMjD,GAAKqD,WAAW/C,MAAQ2C,MAAMjD,EAAIqD,WAAW/C,KAAOjC,QAAQiF,SAClEL,MAAM/C,GAAKmD,WAAW9C,KAAO0C,MAAM/C,EAAImD,WAAW9C,IAAMlC,QAAQkF,UAO3ErG,wBAAwBgB,UAAUN,QAAU,kBACjChB,EAAE4G,SAASC,eAAelG,KAAKJ,eAO1CD,wBAAwBgB,UAAUG,QAAU,kBACjCd,KAAKK,UAAUU,KAAK,uBAG/BpB,wBAAwBgB,UAAUwF,gBAAkB,SAASC,OACrDrG,MAAQC,KACRqG,QAAUhH,EAAE+G,EAAEE,QAAQC,QAAQ,cAEvBjH,SAASkH,QAAQJ,GAClBK,UAIVJ,QAAQ/F,SAAS,gBAAgBsC,IAAI,YAAa,MAEpCyD,QAAQK,SAAS,YAClB,KACLC,WAAa5G,MAAMwE,aAAa8B,SAChCM,WAAW9F,SACX8F,WAAWrG,SAAS,UACpB+F,QAAQV,OAAOgB,WAAWhB,WAIlCrG,SAASmH,MAAML,EAAGC,SAAS,eAExB,SAAS5D,EAAGE,EAAG0D,SACdtG,MAAM6G,QAAQP,cAQtB1G,wBAAwBgB,UAAUiG,QAAU,SAASP,aAI7CQ,OAHAC,QAAS,EACTlD,SAAW5D,KAAK6D,uBAAuBwC,SACvCzE,QAAU5B,KAAK4B,aAGnByE,QAAQxD,KAAK,QAASwD,QAAQV,SAAS5C,MAAMF,KAAK,QAASwD,QAAQV,SAAS3C,KAC5E6D,OAAS,IAAItH,OAAOkG,MAAMY,QAAQxD,KAAK,SAAUwD,QAAQxD,KAAK,UAC1D7C,KAAK6F,cAAcgB,QAAS,MACvBvC,eAAe+B,SAAS,GAC7BS,QAAS,EAILT,QAAQxD,KAAK,gBACbwD,QAAQxD,KAAK,cAAe,UAI5BkE,QAAU/G,KAAK4F,iBAAiBiB,QACpCE,QAAU,IAAIxH,OAAOkG,MAAMsB,QAAQtE,EAAIb,QAASmF,QAAQpE,EAAIf,SAC5DyE,QAAQxD,KAAK,UAAWkE,QAAQtE,GAAGI,KAAK,UAAWkE,QAAQpE,GAG1DmE,YAIItC,kBAAkB6B,eAHlBW,aAAaX,cACbY,mBAAmBZ,eAKvBa,oBAAoBtD,WAO7BjE,wBAAwBgB,UAAUuG,oBAAsB,SAAStD,cACzDE,YAAc,OACdqD,MAAQnH,KAAKK,UAAUU,KAAK,kCAAoC6C,UAChEwD,KAAOpH,KACP4B,QAAU5B,KAAK4B,UAEfuF,MAAMtG,QACNsG,MAAM3D,MAAK,eACHQ,KAAO3E,EAAEW,SACRgE,KAAK0C,SAAS,iBAAoB1C,KAAKnB,KAAK,eAWtCmB,KAAKnB,KAAK,iBACjBiB,YAAYA,YAAYjD,QAAUmD,KAAKnB,KAAK,oBAZiB,CACzDmB,KAAKnB,KAAK,gBAAkBjB,SAE5BoC,KAAKnB,KAAK,QAASmB,KAAK2B,SAAS5C,MAAMF,KAAK,QAASmB,KAAK2B,SAAS3C,SAEnE6D,OAAS,IAAItH,OAAOkG,MAAMzB,KAAKnB,KAAK,SAAUmB,KAAKnB,KAAK,aACxDuE,KAAKvB,cAAcgB,QAAS,KACxBE,QAAUK,KAAKxB,iBAAiBiB,QACpCE,QAAU,IAAIxH,OAAOkG,MAAMsB,QAAQtE,EAAIb,QAASmF,QAAQpE,EAAIf,SAC5DkC,YAAYA,YAAYjD,QAAUkG,kBAQ7C1G,UAAUU,KAAK,eAAiB6C,UAAU0B,IAAIxB,YAAYuD,KAAK,MAChErH,KAAK8E,yBAELwC,gBAAgBC,uBAEXnH,eAAiBJ,KAAKyE,8BAQnC9E,wBAAwBgB,UAAU6G,eAAiB,SAASpB,OACpDpC,KAAO3E,EAAE+G,EAAEE,QAAQC,QAAQ,WAC3Bb,MAAQ,IAAInG,OAAOkG,MAAMzB,KAAK2B,SAAS5C,KAAMiB,KAAK2B,SAAS3C,KAC3DY,SAAW5D,KAAK6D,uBAAuBG,aAEnCoC,EAAEqB,cACDjI,KAAKkI,eACL,GACDhC,MAAMjD,GAAK,aAEVjD,KAAKmI,gBACL,GACDjC,MAAMjD,GAAK,aAEVjD,KAAKoI,eACL,GACDlC,MAAM/C,GAAK,aAEVnD,KAAKqI,aACL,GACDnC,MAAM/C,GAAK,aAEVnD,KAAKsI,WACLtI,KAAKuI,OACNrC,MAAQ,6BAKhBU,EAAE4B,iBAEY,OAAVtC,MAAgB,CAChBA,MAAQ1F,KAAKiI,iBAAiBvC,OAC9B1B,KAAK2B,OAAO,MAASD,MAAMjD,MAAUiD,MAAM/C,IAC3CqB,KAAKnB,KAAK,QAASmB,KAAK2B,SAAS5C,MAAMF,KAAK,QAASmB,KAAK2B,SAAS3C,SAC/D6D,OAAS7G,KAAK4F,iBAAiB,IAAIrG,OAAOkG,MAAMzB,KAAKnB,KAAK,SAAUmB,KAAKnB,KAAK,cAClFmB,KAAKnB,KAAK,UAAWgE,OAAOpE,EAAIzC,KAAK4B,WAAWiB,KAAK,UAAWgE,OAAOlE,EAAI3C,KAAK4B,WAC5E5B,KAAK6F,cAAc,IAAItG,OAAOkG,MAAMzB,KAAK2B,SAAS5C,KAAMiB,KAAK2B,SAAS3C,OAClEgB,KAAK0C,SAAS,YAAa,MACtBpC,eAAeN,MAAM,OACtB2C,WAAa3G,KAAKuE,aAAaP,MAC/B2C,WAAW9F,QACX8F,WAAWrG,SAAS,eAEnBkE,kBAAkBR,YAI/BA,KAAKpB,IAAI,OAAQ,IAAIA,IAAI,MAAO,IAChCoB,KAAKnB,KAAK,QAASmB,KAAK2B,SAAS5C,MAAMF,KAAK,QAASmB,KAAK2B,SAAS3C,UAC9DgE,aAAahD,WACbiD,mBAAmBjD,MAE5BA,KAAKkE,aACAhB,oBAAoBtD,WAS7BjE,wBAAwBgB,UAAUsH,iBAAmB,SAASE,cACtDC,MAAQpI,KAAKc,UACbiG,QAAU/G,KAAK4F,iBAAiBuC,iBACpCpB,QAAQtE,EAAI4F,KAAKC,IAAI,EAAGvB,QAAQtE,GAChCsE,QAAQpE,EAAI0F,KAAKC,IAAI,EAAGvB,QAAQpE,GAChCoE,QAAQtE,EAAI4F,KAAKE,IAAIH,MAAMrC,QAASgB,QAAQtE,GAC5CsE,QAAQpE,EAAI0F,KAAKE,IAAIH,MAAMpC,SAAUe,QAAQpE,GACtC3C,KAAKqE,kBAAkB0C,UASlCpH,wBAAwBgB,UAAUkD,uBAAyB,SAAS2E,aACzDC,OAAOzI,KAAK0I,0BAA0BF,KAAM,YAUvD7I,wBAAwBgB,UAAU+H,0BAA4B,SAASF,KAAMG,YACrEC,QAAUvJ,EAAEmJ,MAAMK,KAAK,iBACXC,IAAZF,SAAqC,KAAZA,gBACrBG,WAAaH,QAAQpD,MAAM,KACtBwD,MAAQ,EAAGA,MAAQD,WAAWlI,OAAQmI,QAAS,IACxC,IAAIC,OAAO,IAAMN,OAAS,aAC5BO,KAAKH,WAAWC,QAAS,KAE3BG,MADQ,IAAIF,OAAO,aACLG,KAAKL,WAAWC,eAC3BP,OAAOU,MAAM,YAIzB,MAMXxJ,wBAAwBgB,UAAU0I,aAAe,eACzCtJ,MAAQC,KACR4B,QAAU5B,KAAK4B,UACf5B,KAAKG,aACLyB,QAAU,QAGTvB,UAAUU,KAAK,wBAAwBwC,IAAI,iBAAiBC,MAAK,SAASC,IAAKO,MAChF3E,EAAE2E,MACGpB,IAAI,OAAQ0G,WAAWjK,EAAE2E,MAAMnB,KAAK,YAAcyG,WAAW1H,UAC7DgB,IAAI,MAAO0G,WAAWjK,EAAE2E,MAAMnB,KAAK,YAAcyG,WAAW1H,UACjE7B,MAAMkD,mBAAmBe,KAAM,oBAG9B3D,UAAUU,KAAK,8BACfgF,MAAM/F,KAAKc,UAAUiF,SACrBC,OAAOhG,KAAKc,UAAUkF,cAEtB,IAAI3E,WAAa,EAAGA,WAAarB,KAAKF,iBAAiBe,OAAQQ,aAAc,KAE1EkI,aADWxJ,MAAMD,iBAAiBuB,YACVS,OACxBJ,MAAQ3B,MAAME,OAAOoB,YACrB6B,SAAWnD,MAAMG,UAAUmB,YAC/BK,MAAMG,MAAM0H,aAAc3H,SAC1BF,MAAM8H,UAAUtG,cAEZb,QAAUX,MAAMY,qBAChBmH,WAAazJ,KAAKK,UAAUU,KAAK,6CAA+CM,YACpFoI,WACK7G,IAAI,OAAQP,QAAQG,WAAWC,EAAKgH,WAAWxI,aAAe,EAAK,GACnE2B,IAAI,MAAOP,QAAQG,WAAWG,EAAK8G,WAAWvI,cAAgB,GACnEnB,MAAMkD,mBAAmBwG,WAAY,YAO7C9J,wBAAwBgB,UAAU+I,WAAa,eACvC3J,MAAQC,UACPK,UAAUU,KAAK,6BAA6ByC,MAAK,SAASwF,MAAOW,cAC9D3F,KAAO3E,EAAEsK,UACTC,YAAc5F,KAAKG,QACvByF,YAAYC,cACZD,YAAYtJ,SAAS,UACrBsJ,YAAYtJ,SAAS,SAAWP,MAAM8D,uBAAuBG,OAC7D4F,YAAYtJ,SAASP,MAAM+J,eAAe9F,MAAM,IAChD4F,YAAYtJ,SAAS,mBACrB0D,KAAK+F,OAAOH,iBAUpBjK,wBAAwBgB,UAAUqJ,UAAY,SAAShG,aAC5ChE,KAAK0I,0BAA0B1E,KAAM,WAUhDrE,wBAAwBgB,UAAUmJ,eAAiB,SAAS9F,KAAMiG,qBAC1DC,UAAY,SAAWlK,KAAKgK,UAAUhG,aACtChE,KAAKmK,eAAenG,QACpBkG,UAAY,YAGZD,gBACO,IAAMC,UAGVA,WASXvK,wBAAwBgB,UAAU4D,aAAe,SAASP,aAC/ChE,KAAKK,UAAUU,KAAK,gCACXf,KAAK6D,uBAAuBG,MAAQhE,KAAK8J,eAAe9F,MAAM,GAAQ,qBAO1FrE,wBAAwBgB,UAAUyJ,SAAW,kBAClCpK,KAAKK,UAAUU,KAAK,iBAQ/BpB,wBAAwBgB,UAAUqG,aAAe,SAAShD,MACtDA,KAAK6F,YAAY,gBACZvJ,SAAS,YACTsC,IAAI,MAAO,IACXA,IAAI,OAAQ,IACZA,IAAI,YAAa,QAClBgH,YAAc5J,KAAKuE,aAAaP,MACpC4F,YAAYS,MAAMrG,MAClB4F,YAAYC,YAAY,WAU5BlK,wBAAwBgB,UAAU2D,eAAiB,SAASN,KAAMsG,eAAWC,wEACrEH,SAAWpK,KAAKoK,WAChBxI,QAAU5B,KAAK4B,UACnBoC,KAAK6F,YAAY,gBAAgBA,YAAY,gBACzChD,OAAS7G,KAAK4F,iBAAiB,IAAIrG,OAAOkG,MAAMzB,KAAKnB,KAAK,SAAUmB,KAAKnB,KAAK,WAC9EyH,WACAtG,KAAKnB,KAAK,UAAWgE,OAAOpE,EAAIb,SAASiB,KAAK,UAAWgE,OAAOlE,EAAIf,SACpEoC,KAAKpB,IAAI,OAAQiE,OAAOpE,GAAGG,IAAI,MAAOiE,OAAOlE,KAE7CqB,KAAKnB,KAAK,UAAWgE,OAAOpE,GAAGI,KAAK,UAAWgE,OAAOlE,GACtDqB,KAAKpB,IAAI,OAAQiE,OAAOpE,EAAIb,SAASgB,IAAI,MAAOiE,OAAOlE,EAAIf,UAG1D2I,aAEDvG,KAAKnB,KAAK,aAAcjB,SAE5BwI,SAASjI,OAAO6B,WACXf,mBAAmBe,KAAM,aAQlCrE,wBAAwBgB,UAAU6D,kBAAoB,SAASR,UACvDW,UAAY3E,KAAKwK,SAASxG,MAC1ByG,UAAYhC,OAAOzI,KAAK0I,0BAA0B/D,UAAW,cAC7D+F,yBAA2B1K,KAAKK,UAAUU,KAAK,8BAC3Cf,KAAK6D,uBAAuBG,MAAQhE,KAAK8J,eAAe9F,MAAM,IAAOnD,OACzE8J,0BAA4B3K,KAAKK,UAAUU,KAAK,+BAC5Cf,KAAK6D,uBAAuBG,MAAQhE,KAAK8J,eAAe9F,MAAM,IAAOT,IAAI,oBAAoB1C,WAEhGb,KAAKmK,eAAenG,QAChBhE,KAAKmK,eAAenG,OAAS0G,yBAA2BD,YAA4C,IAA9BE,0BAAiC,KACxGC,UAAY5G,KAAKG,QACrByG,UAAUtK,SAAS,YACdsC,IAAI,MAAO,IACXA,IAAI,OAAQ,IACZA,IAAI,YAAa,SACjB2B,aAAaP,MACb6F,YAAY,UACZQ,MAAMO,WACXtD,gBAAgBuD,yBAAyBD,aASjDjL,wBAAwBgB,UAAUsG,mBAAqB,SAASjD,cACxD8G,YAAc9K,KAAKK,UAAUU,KAAK,+BAClCf,KAAK6D,uBAAuBG,MAAQhE,KAAK8J,eAAe9F,MAAM,IAAOT,IAAI,oBACzEwH,eAAiBD,YAAYjK,OAC1BkK,eAAiB,GACpBD,YAAYE,QAAQ/I,SACpB8I,kBAURpL,wBAAwBgB,UAAU6J,SAAW,SAASxG,UAC9CJ,SAAW5D,KAAK6D,uBAAuBG,aACpChE,KAAKK,UAAUU,KAAK,uBAAyB6C,WAQxDjE,wBAAwBgB,UAAUiB,QAAU,eACpCwG,MAAQpI,KAAKc,UACbmK,kBAAoB7C,MAAM8C,IAAI,GAAGC,oBACd/C,MAAMrC,QAEHkF,mBAS9BtL,wBAAwBgB,UAAUsC,mBAAqB,SAASmI,QAASC,UACjEzJ,QAAU0H,WAAWtJ,KAAK4B,WAC1B5B,KAAKG,aACLyB,QAAU,GAEdvC,EAAE+L,SAASxI,IAAI,qBACU,SAAWhB,QAAU,qBACxB,SAAWA,QAAU,oBACtB,SAAWA,QAAU,mBACtB,SAAWA,QAAU,cACxB,SAAWA,QAAU,uBACdyJ,QAS5B1L,wBAAwBgB,UAAUwJ,eAAiB,SAASnG,aACjDA,KAAK0C,SAAS,aASzB/G,wBAAwBgB,UAAUD,2BAA6B,eACvDX,MAAQC,KAGRA,KAAKO,kBAK0B,OAA/BP,KAAKsL,uBACLC,aAAavL,KAAKsL,uBAMlBtL,KAAKQ,wBAAwBK,OAAS,OACjCyK,sBAAwBE,YAAW,gBAC/B9K,+BACN,WAKFH,iBAAkB,OAClBmJ,kBACArG,uBACAzC,gBAELqF,SAASwF,iBAAiB/L,YAAYgM,WAAWC,gCAAiCC,WAC9EA,SAASC,OAAOC,MAAMzG,SAAS+F,UAC3BrL,MAAMgM,gCAAgCX,kBAUlDzL,wBAAwBgB,UAAUoL,gCAAkC,SAASC,qBACrEC,oBAAsB5M,EAAE2M,uBACtBE,eAAiBD,oBAAoBE,SAAS5F,QAAQ,eACtD6F,SAAWH,oBAAoBvF,SAAS,UACxCpD,KAAOtD,KAAKK,cAEb6L,iBAAmBE,mBAGpBF,iBACAD,oBAAsBA,oBAAoBE,SAAS5F,QAAQ,gBAE3DjD,KAAKvC,KAAKkL,qBAAqBpL,QAAU,eAKvCwL,OAASrM,KAAKgK,UAAUiC,qBACxBrI,SAAW5D,KAAK6D,uBAAuBoI,qBACvCK,2BAA6B,CAC/B,qDAAuDD,OAAS,UAAYzI,SAC5E,oDAAsDyI,OAAS,UAAYzI,SAC3E,8DAAgEA,SAChE,6DAA+DA,cAE/D2I,uBAAyB,SAEvBC,sBAAwBP,oBAAoB9H,QAClDmI,2BAA2BjH,SAAQ,SAASoH,UACxCnJ,KAAKvC,KAAK0L,UAAUjJ,MAAK,SAASS,EAAGuE,YAC3BkE,cAAgBrN,EAAEmJ,MAAMK,KAAK,SAC7B8D,cAAgBtN,EAAEmJ,MAAMK,KAAK,SAEnC2D,sBAAsB3D,KAAK,QAAS6D,eACpCF,sBAAsB3D,KAAK,QAAS8D,eAEpCrF,gBAAgBuD,yBAAyB2B,uBAEzCnN,EAAEmJ,MAAMuB,OAAOyC,uBACfD,uBAAuBK,KAAKpE,YAGpC+D,uBAAuBlH,SAAQ,SAASmD,MACpCnJ,EAAEmJ,MAAMvG,aAShBtC,wBAAwBgB,UAAUH,sBAAwB,kBAC/CR,KAAKK,UAAUU,KAAK,gCAAgCwC,KAAI,SAASU,EAAG4I,gBAChE7M,KAAK8M,cAAcD,aAUlClN,wBAAwBgB,UAAUmM,cAAgB,SAASC,mBAChDA,WAAWC,UAAyC,IAA7BD,WAAWE,mBASzC3F,gBAAkB,CAKlB4F,0BAA0B,EAM1BC,+BAAgC,GAKhChN,YAAY,EAKZiN,sBAAsB,EAKtBC,UAAW,GAQXC,KAAM,SAAS1N,YAAaC,gBAClBC,iBAAmBoF,KAAKrD,MAAMoE,SAASsH,cAAc,IAAM3N,YAAc,eAC1E4N,QAAQC,sBACbnG,gBAAgB+F,UAAUzN,aACtB,IAAID,wBAAwBC,YAAaC,SAAUC,kBAClDwH,gBAAgB4F,2BACjB5F,gBAAgBoG,qBAChBpG,gBAAgB4F,0BAA2B,IAE1C5F,gBAAgB6F,+BAA+BQ,eAAe/N,aAAc,CAC7E0H,gBAAgB6F,+BAA+BvN,cAAe,MAE1DgO,kBAAoB3H,SAASC,eAAetG,aAC5CgO,kBAAkBC,UAAUC,SAAS,cACpCF,kBAAkBC,UAAUC,SAAS,6BAEtCxG,gBAAgBuD,yBAAyBxL,EAAEuO,mBAAmB7M,KAAK,0BACnEuG,gBAAgBuD,yBAAyBxL,EAAEuO,mBAAmB7M,KAAK,4BAQ/E2M,mBAAoB,WAChBrO,EAAE0O,QAAQC,GAAG,UAAU,WACnB1G,gBAAgB2G,oBAAmB,MAEvCF,OAAOtC,iBAAiB,eAAe,WACnCnE,gBAAgBnH,YAAa,EAC7BmH,gBAAgB2G,mBAAmB3G,gBAAgBnH,eAEvD4N,OAAOtC,iBAAiB,cAAc,WAClCnE,gBAAgBnH,YAAa,EAC7BmH,gBAAgB2G,mBAAmB3G,gBAAgBnH,eAEvDqL,YAAW,WACPlE,gBAAgB4G,2BACjB,MAQPrD,yBAA0B,SAASO,SAC/BA,QACK4C,GAAG,uBAAwB1G,gBAAgBnB,iBAC3C6H,GAAG,mBAAoB1G,gBAAgBE,gBACvC2G,SAAQ,SAAS/H,GACdkB,gBAAgB8G,oBAAoBhI,GAAG,MAE1CiI,UAAS,SAASjI,GACfkB,gBAAgB8G,oBAAoBhI,GAAG,OAQnDD,gBAAiB,SAASC,GACtBA,EAAE4B,qBACEsG,SAAWhH,gBAAgBiH,oBAAoBnI,GAC/CkI,UACAA,SAASnI,gBAAgBC,IAQjCoB,eAAgB,SAASpB,OACjBkI,SAAWhH,gBAAgBiH,oBAAoBnI,GAC/CkI,UACAA,SAAS9G,eAAepB,IAQhC6H,mBAAoB,SAAS9N,gBACpB,IAAIP,eAAe0H,gBAAgB+F,UAChC/F,gBAAgB+F,UAAUM,eAAe/N,eACzC0H,gBAAgB+F,UAAUzN,aAAaO,WAAaA,WACpDmH,gBAAgB+F,UAAUzN,aAAayJ,iBAUnD+E,oBAAqB,SAAShI,EAAGoI,cAC7BlH,gBAAgB8F,qBAAuBoB,cAQ3CN,uBAAwB,WACf5G,gBAAgB8F,2BACZa,mBAAmB3G,gBAAgBnH,YAK5CqL,YAAW,WACPlE,gBAAgB4G,uBAAuB5G,gBAAgBnH,cACxD,MAQPoO,oBAAqB,SAASnI,OACtBxG,YAAcP,EAAE+G,EAAEqI,eAAelI,QAAQ,iBAAiBsC,KAAK,aAC5DvB,gBAAgB+F,UAAUzN,cAMrC2H,gBAAiB,iBACPmH,aAAezI,SAASC,eAAe,gBAC7CzG,kBAAkBkP,gBAAgBD,sBAOnC,CASHpB,KAAMhG,gBAAgBgG"} \ No newline at end of file +{"version":3,"file":"question.min.js","sources":["../src/question.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Question class for drag and drop marker question type, used to support the question and preview pages.\n *\n * @module qtype_ddmarker/question\n * @copyright 2018 The Open University\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\ndefine([\n 'jquery',\n 'core/dragdrop',\n 'qtype_ddmarker/shapes',\n 'core/key_codes',\n 'core_form/changechecker',\n 'core_filters/events',\n], function(\n $,\n dragDrop,\n Shapes,\n keys,\n FormChangeChecker,\n filterEvent\n) {\n\n \"use strict\";\n\n /**\n * Object to handle one drag-drop markers question.\n *\n * @param {String} containerId id of the outer div for this question.\n * @param {boolean} readOnly whether the question is being displayed read-only.\n * @param {Object[]} visibleDropZones the geometry of any drop-zones to show.\n * Objects have fields shape, coords and markertext.\n * @constructor\n */\n function DragDropMarkersQuestion(containerId, readOnly, visibleDropZones) {\n var thisQ = this;\n this.containerId = containerId;\n this.visibleDropZones = visibleDropZones;\n this.shapes = [];\n this.shapeSVGs = [];\n this.isPrinting = false;\n this.questionAnswer = {};\n if (readOnly) {\n this.getRoot().addClass('qtype_ddmarker-readonly');\n }\n thisQ.allImagesLoaded = false;\n thisQ.getNotYetLoadedImages().one('load', function() {\n thisQ.waitForAllImagesToBeLoaded();\n });\n thisQ.waitForAllImagesToBeLoaded();\n }\n\n /**\n * Draws the svg shapes of any drop zones that should be visible for feedback purposes.\n */\n DragDropMarkersQuestion.prototype.drawDropzones = function() {\n if (this.visibleDropZones.length > 0) {\n var bgImage = this.bgImage();\n\n this.getRoot().find('div.dropzones').html('');\n var svg = this.getRoot().find('svg.dropzones');\n\n var nextColourIndex = 0;\n for (var dropZoneNo = 0; dropZoneNo < this.visibleDropZones.length; dropZoneNo++) {\n var colourClass = 'color' + nextColourIndex;\n nextColourIndex = (nextColourIndex + 1) % 8;\n this.addDropzone(svg, dropZoneNo, colourClass);\n }\n }\n };\n\n /**\n * Adds a dropzone shape with colour, coords and link provided to the array of shapes.\n *\n * @param {jQuery} svg the SVG image to which to add this drop zone.\n * @param {int} dropZoneNo which drop-zone to add.\n * @param {string} colourClass class name\n */\n DragDropMarkersQuestion.prototype.addDropzone = function(svg, dropZoneNo, colourClass) {\n var dropZone = this.visibleDropZones[dropZoneNo],\n shape = Shapes.make(dropZone.shape, ''),\n existingmarkertext,\n bgRatio = this.bgRatio();\n if (!shape.parse(dropZone.coords, bgRatio)) {\n return;\n }\n\n existingmarkertext = this.getRoot().find('div.markertexts span.markertext' + dropZoneNo);\n if (existingmarkertext.length) {\n if (dropZone.markertext !== '') {\n existingmarkertext.html(dropZone.markertext);\n filterEvent.notifyFilterContentUpdated(existingmarkertext);\n } else {\n existingmarkertext.remove();\n }\n } else if (dropZone.markertext !== '') {\n var classnames = 'markertext markertext' + dropZoneNo;\n this.getRoot().find('div.markertexts').append('' +\n dropZone.markertext + '');\n var markerspan = this.getRoot().find('div.ddarea div.markertexts span.markertext' + dropZoneNo);\n if (markerspan.length) {\n var handles = shape.getHandlePositions();\n var positionLeft = handles.moveHandle.x - (markerspan.outerWidth() / 2) - 4;\n var positionTop = handles.moveHandle.y - (markerspan.outerHeight() / 2);\n markerspan\n .css('left', positionLeft)\n .css('top', positionTop);\n markerspan\n .data('originX', markerspan.position().left / bgRatio)\n .data('originY', markerspan.position().top / bgRatio);\n this.handleElementScale(markerspan, 'center');\n }\n filterEvent.notifyFilterContentUpdated(markerspan);\n }\n\n var shapeSVG = shape.makeSvg(svg[0]);\n shapeSVG.setAttribute('class', 'dropzone ' + colourClass);\n\n this.shapes[this.shapes.length] = shape;\n this.shapeSVGs[this.shapeSVGs.length] = shapeSVG;\n };\n\n /**\n * Draws the drag items on the page (and drop zones if required).\n * The idea is to re-draw all the drags and drops whenever there is a change\n * like a widow resize or an item dropped in place.\n */\n DragDropMarkersQuestion.prototype.repositionDrags = function() {\n var root = this.getRoot(),\n thisQ = this;\n\n root.find('div.draghomes .marker').not('.dragplaceholder').each(function(key, item) {\n $(item).addClass('unneeded');\n });\n\n root.find('input.choices').each(function(key, input) {\n var choiceNo = thisQ.getChoiceNoFromElement(input),\n imageCoords = thisQ.getImageCoords(input);\n if (imageCoords.length) {\n var drag = thisQ.getRoot().find('.draghomes' + ' span.marker' + '.choice' + choiceNo).not('.dragplaceholder');\n drag.remove();\n for (var i = 0; i < imageCoords.length; i++) {\n var dragInDrop = drag.clone();\n // Convert image coords to screen coords.\n const screenCoords = thisQ.convertToWindowXY(imageCoords[i]);\n dragInDrop.data('pagex', screenCoords.x).data('pagey', screenCoords.y);\n // Save image coords to the drag item so we can use it later.\n dragInDrop.data('imageCoords', imageCoords[i]);\n // We always save the coordinates in the 1:1 ratio.\n // So we need to set the scale ratio to 1 for the initial load.\n dragInDrop.data('scaleRatio', 1);\n thisQ.sendDragToDrop(dragInDrop, false, true);\n }\n thisQ.getDragClone(drag).addClass('active');\n thisQ.cloneDragIfNeeded(drag);\n }\n });\n\n // Save the question answer.\n thisQ.questionAnswer = thisQ.getQuestionAnsweredValues();\n };\n\n /**\n * Get the question answered values.\n *\n * @return {Object} Contain key-value with key is the input id and value is the input value.\n */\n DragDropMarkersQuestion.prototype.getQuestionAnsweredValues = function() {\n let result = {};\n this.getRoot().find('input.choices').each((i, inputNode) => {\n result[inputNode.id] = inputNode.value;\n });\n\n return result;\n };\n\n /**\n * Check if the question is being interacted or not.\n *\n * @return {boolean} Return true if the user has changed the question-answer.\n */\n DragDropMarkersQuestion.prototype.isQuestionInteracted = function() {\n const oldAnswer = this.questionAnswer;\n const newAnswer = this.getQuestionAnsweredValues();\n let isInteracted = false;\n\n // First, check both answers have the same structure or not.\n if (JSON.stringify(newAnswer) !== JSON.stringify(oldAnswer)) {\n isInteracted = true;\n return isInteracted;\n }\n // Check the values.\n Object.keys(newAnswer).forEach(key => {\n if (newAnswer[key] !== oldAnswer[key]) {\n isInteracted = true;\n }\n });\n\n return isInteracted;\n };\n\n /**\n * Determine what drag items need to be shown and\n * return coords of all drag items except any that are currently being dragged\n * based on contents of hidden inputs and whether drags are 'infinite' or how many\n * drags should be shown.\n *\n * @param {jQuery} inputNode\n * @returns {Point[]} image coordinates of however many copies of the drag item should be shown.\n */\n DragDropMarkersQuestion.prototype.getImageCoords = function(inputNode) {\n var imageCoords = [],\n val = $(inputNode).val();\n if (val !== '') {\n var coordsStrings = val.split(';');\n for (var i = 0; i < coordsStrings.length; i++) {\n imageCoords[i] = Shapes.Point.parse(coordsStrings[i]);\n }\n }\n return imageCoords;\n };\n\n /**\n * Converts the relative x and y position coordinates into\n * absolute x and y position coordinates.\n *\n * @param {Point} point relative to the background image.\n * @returns {Point} point relative to the page.\n */\n DragDropMarkersQuestion.prototype.convertToWindowXY = function(point) {\n var bgImage = this.bgImage();\n // The +1 seems rather odd, but seems to give the best results in\n // the three main browsers at a range of zoom levels.\n // (Its due to the 1px border around the image, that shifts the\n // image pixels by 1 down and to the left.)\n return point.offset(bgImage.offset().left + 1, bgImage.offset().top + 1);\n };\n\n /**\n * Utility function converting window coordinates to relative to the\n * background image coordinates.\n *\n * @param {Point} point relative to the page.\n * @returns {Point} point relative to the background image.\n */\n DragDropMarkersQuestion.prototype.convertToBgImgXY = function(point) {\n var bgImage = this.bgImage();\n return point.offset(-bgImage.offset().left - 1, -bgImage.offset().top - 1);\n };\n\n /**\n * Is the point within the background image?\n *\n * @param {Point} point relative to the BG image.\n * @return {boolean} true it they are.\n */\n DragDropMarkersQuestion.prototype.coordsInBgImg = function(point) {\n var bgImage = this.bgImage();\n var bgPosition = bgImage.offset();\n\n return point.x >= bgPosition.left && point.x < bgPosition.left + bgImage.width()\n && point.y >= bgPosition.top && point.y < bgPosition.top + bgImage.height();\n };\n\n /**\n * Get the outer div for this question.\n * @returns {jQuery} containing that div.\n */\n DragDropMarkersQuestion.prototype.getRoot = function() {\n return $(document.getElementById(this.containerId));\n };\n\n /**\n * Get the img that is the background image.\n * @returns {jQuery} containing that img.\n */\n DragDropMarkersQuestion.prototype.bgImage = function() {\n return this.getRoot().find('img.dropbackground');\n };\n\n DragDropMarkersQuestion.prototype.handleDragStart = function(e) {\n var thisQ = this,\n dragged = $(e.target).closest('.marker');\n\n var info = dragDrop.prepare(e);\n if (!info.start) {\n return;\n }\n\n dragged.addClass('beingdragged').css('transform', '');\n\n var placed = !dragged.hasClass('unneeded');\n if (!placed) {\n var hiddenDrag = thisQ.getDragClone(dragged);\n if (hiddenDrag.length) {\n hiddenDrag.addClass('active');\n dragged.offset(hiddenDrag.offset());\n }\n }\n\n dragDrop.start(e, dragged, function() {\n void (1);\n }, function(x, y, dragged) {\n thisQ.dragEnd(dragged);\n });\n };\n\n /**\n * Functionality at the end of a drag drop.\n * @param {jQuery} dragged the marker that was dragged.\n */\n DragDropMarkersQuestion.prototype.dragEnd = function(dragged) {\n var placed = false,\n choiceNo = this.getChoiceNoFromElement(dragged),\n bgRatio = this.bgRatio(),\n dragXY;\n\n dragged.data('pagex', dragged.offset().left).data('pagey', dragged.offset().top);\n dragXY = new Shapes.Point(dragged.data('pagex'), dragged.data('pagey'));\n if (this.coordsInBgImg(dragXY)) {\n this.sendDragToDrop(dragged, true);\n placed = true;\n // Since we already move the drag item to new position.\n // Remove the image coords if this drag item have it.\n // We will get the new image coords for this drag item in saveCoordsForChoice.\n if (dragged.data('imageCoords')) {\n dragged.data('imageCoords', null);\n }\n // It seems that the dragdrop sometimes leaves the drag\n // one pixel out of position. Put it in exactly the right place.\n var bgImgXY = this.convertToBgImgXY(dragXY);\n bgImgXY = new Shapes.Point(bgImgXY.x / bgRatio, bgImgXY.y / bgRatio);\n dragged.data('originX', bgImgXY.x).data('originY', bgImgXY.y);\n }\n\n if (!placed) {\n this.sendDragHome(dragged);\n this.removeDragIfNeeded(dragged);\n } else {\n this.cloneDragIfNeeded(dragged);\n }\n\n this.saveCoordsForChoice(choiceNo);\n };\n\n /**\n * Save the coordinates for a dropped item in the form field.\n * @param {Number} choiceNo which copy of the choice this was.\n */\n DragDropMarkersQuestion.prototype.saveCoordsForChoice = function(choiceNo) {\n let imageCoords = [];\n var items = this.getRoot().find('div.droparea span.marker.choice' + choiceNo),\n thiQ = this,\n bgRatio = this.bgRatio();\n\n if (items.length) {\n items.each(function() {\n var drag = $(this);\n if (!drag.hasClass('beingdragged') && !drag.data('imageCoords')) {\n if (drag.data('scaleRatio') !== bgRatio) {\n // The scale ratio for the draggable item was changed. We need to update that.\n drag.data('pagex', drag.offset().left).data('pagey', drag.offset().top);\n }\n var dragXY = new Shapes.Point(drag.data('pagex'), drag.data('pagey'));\n if (thiQ.coordsInBgImg(dragXY)) {\n var bgImgXY = thiQ.convertToBgImgXY(dragXY);\n bgImgXY = new Shapes.Point(bgImgXY.x / bgRatio, bgImgXY.y / bgRatio);\n imageCoords[imageCoords.length] = bgImgXY;\n }\n } else if (drag.data('imageCoords')) {\n imageCoords[imageCoords.length] = drag.data('imageCoords');\n }\n });\n }\n\n this.getRoot().find('input.choice' + choiceNo).val(imageCoords.join(';'));\n if (this.isQuestionInteracted()) {\n // The user has interacted with the draggable items. We need to mark the form as dirty.\n questionManager.handleFormDirty();\n // Save the new answered value.\n this.questionAnswer = this.getQuestionAnsweredValues();\n }\n };\n\n /**\n * Handle key down / press events on markers.\n * @param {KeyboardEvent} e\n */\n DragDropMarkersQuestion.prototype.handleKeyPress = function(e) {\n var drag = $(e.target).closest('.marker'),\n point = new Shapes.Point(drag.offset().left, drag.offset().top),\n choiceNo = this.getChoiceNoFromElement(drag);\n\n switch (e.keyCode) {\n case keys.arrowLeft:\n case 65: // A.\n point.x -= 1;\n break;\n case keys.arrowRight:\n case 68: // D.\n point.x += 1;\n break;\n case keys.arrowDown:\n case 83: // S.\n point.y += 1;\n break;\n case keys.arrowUp:\n case 87: // W.\n point.y -= 1;\n break;\n case keys.space:\n case keys.escape:\n point = null;\n break;\n default:\n return; // Ingore other keys.\n }\n e.preventDefault();\n\n if (point !== null) {\n point = this.constrainToBgImg(point);\n drag.offset({'left': point.x, 'top': point.y});\n drag.data('pagex', drag.offset().left).data('pagey', drag.offset().top);\n var dragXY = this.convertToBgImgXY(new Shapes.Point(drag.data('pagex'), drag.data('pagey')));\n drag.data('originX', dragXY.x / this.bgRatio()).data('originY', dragXY.y / this.bgRatio());\n if (this.coordsInBgImg(new Shapes.Point(drag.offset().left, drag.offset().top))) {\n if (drag.hasClass('unneeded')) {\n this.sendDragToDrop(drag, true);\n var hiddenDrag = this.getDragClone(drag);\n if (hiddenDrag.length) {\n hiddenDrag.addClass('active');\n }\n this.cloneDragIfNeeded(drag);\n }\n }\n } else {\n drag.css('left', '').css('top', '');\n drag.data('pagex', drag.offset().left).data('pagey', drag.offset().top);\n this.sendDragHome(drag);\n this.removeDragIfNeeded(drag);\n }\n drag.focus();\n this.saveCoordsForChoice(choiceNo);\n };\n\n /**\n * Makes sure the dragged item always exists within the background image area.\n *\n * @param {Point} windowxy\n * @returns {Point} coordinates\n */\n DragDropMarkersQuestion.prototype.constrainToBgImg = function(windowxy) {\n var bgImg = this.bgImage(),\n bgImgXY = this.convertToBgImgXY(windowxy);\n bgImgXY.x = Math.max(0, bgImgXY.x);\n bgImgXY.y = Math.max(0, bgImgXY.y);\n bgImgXY.x = Math.min(bgImg.width(), bgImgXY.x);\n bgImgXY.y = Math.min(bgImg.height(), bgImgXY.y);\n return this.convertToWindowXY(bgImgXY);\n };\n\n /**\n * Returns the choice number for a node.\n *\n * @param {Element|jQuery} node\n * @returns {Number}\n */\n DragDropMarkersQuestion.prototype.getChoiceNoFromElement = function(node) {\n return Number(this.getClassnameNumericSuffix(node, 'choice'));\n };\n\n /**\n * Returns the numeric part of a class with the given prefix.\n *\n * @param {Element|jQuery} node\n * @param {String} prefix\n * @returns {Number|null}\n */\n DragDropMarkersQuestion.prototype.getClassnameNumericSuffix = function(node, prefix) {\n var classes = $(node).attr('class');\n if (classes !== undefined && classes !== '') {\n var classesarr = classes.split(' ');\n for (var index = 0; index < classesarr.length; index++) {\n var patt1 = new RegExp('^' + prefix + '([0-9])+$');\n if (patt1.test(classesarr[index])) {\n var patt2 = new RegExp('([0-9])+$');\n var match = patt2.exec(classesarr[index]);\n return Number(match[0]);\n }\n }\n }\n return null;\n };\n\n /**\n * Handle when the window is resized.\n */\n DragDropMarkersQuestion.prototype.handleResize = function() {\n var thisQ = this,\n bgRatio = this.bgRatio();\n if (this.isPrinting) {\n bgRatio = 1;\n }\n\n this.getRoot().find('div.droparea .marker').not('.beingdragged').each(function(key, drag) {\n $(drag)\n .css('left', parseFloat($(drag).data('originX')) * parseFloat(bgRatio))\n .css('top', parseFloat($(drag).data('originY')) * parseFloat(bgRatio));\n thisQ.handleElementScale(drag, 'left top');\n });\n\n this.getRoot().find('div.droparea svg.dropzones')\n .width(this.bgImage().width())\n .height(this.bgImage().height());\n\n for (var dropZoneNo = 0; dropZoneNo < this.visibleDropZones.length; dropZoneNo++) {\n var dropZone = thisQ.visibleDropZones[dropZoneNo];\n var originCoords = dropZone.coords;\n var shape = thisQ.shapes[dropZoneNo];\n var shapeSVG = thisQ.shapeSVGs[dropZoneNo];\n shape.parse(originCoords, bgRatio);\n shape.updateSvg(shapeSVG);\n\n var handles = shape.getHandlePositions();\n var markerSpan = this.getRoot().find('div.ddarea div.markertexts span.markertext' + dropZoneNo);\n markerSpan\n .css('left', handles.moveHandle.x - (markerSpan.outerWidth() / 2) - 4)\n .css('top', handles.moveHandle.y - (markerSpan.outerHeight() / 2));\n thisQ.handleElementScale(markerSpan, 'center');\n }\n };\n\n /**\n * Clone the drag.\n */\n DragDropMarkersQuestion.prototype.cloneDrags = function() {\n var thisQ = this;\n this.getRoot().find('div.draghomes span.marker').each(function(index, draghome) {\n var drag = $(draghome);\n var placeHolder = drag.clone();\n placeHolder.removeClass();\n placeHolder.addClass('marker');\n placeHolder.addClass('choice' + thisQ.getChoiceNoFromElement(drag));\n placeHolder.addClass(thisQ.getDragNoClass(drag, false));\n placeHolder.addClass('dragplaceholder');\n drag.before(placeHolder);\n });\n };\n\n /**\n * Get the drag number of a drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {Number} the drag number.\n */\n DragDropMarkersQuestion.prototype.getDragNo = function(drag) {\n return this.getClassnameNumericSuffix(drag, 'dragno');\n };\n\n /**\n * Get the drag number prefix of a drag.\n *\n * @param {jQuery} drag the drag.\n * @param {Boolean} includeSelector include the CSS selector prefix or not.\n * @return {String} Class name\n */\n DragDropMarkersQuestion.prototype.getDragNoClass = function(drag, includeSelector) {\n var className = 'dragno' + this.getDragNo(drag);\n if (this.isInfiniteDrag(drag)) {\n className = 'infinite';\n }\n\n if (includeSelector) {\n return '.' + className;\n }\n\n return className;\n };\n\n /**\n * Get drag clone for a given drag.\n *\n * @param {jQuery} drag the drag.\n * @returns {jQuery} the drag's clone.\n */\n DragDropMarkersQuestion.prototype.getDragClone = function(drag) {\n return this.getRoot().find('.draghomes' + ' span.marker' +\n '.choice' + this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true) + '.dragplaceholder');\n };\n\n /**\n * Get the drop area element.\n * @returns {jQuery} droparea element.\n */\n DragDropMarkersQuestion.prototype.dropArea = function() {\n return this.getRoot().find('div.droparea');\n };\n\n /**\n * Animate a drag back to its home.\n *\n * @param {jQuery} drag the item being moved.\n */\n DragDropMarkersQuestion.prototype.sendDragHome = function(drag) {\n drag.removeClass('beingdragged')\n .addClass('unneeded')\n .css('top', '')\n .css('left', '')\n .css('transform', '');\n var placeHolder = this.getDragClone(drag);\n placeHolder.after(drag);\n placeHolder.removeClass('active');\n };\n\n /**\n * Animate a drag item into a given place.\n *\n * @param {jQuery} drag the item to place.\n * @param {boolean} isScaling Scaling or not.\n * @param {boolean} initialLoad Whether it is the initial load or not.\n */\n DragDropMarkersQuestion.prototype.sendDragToDrop = function(drag, isScaling, initialLoad = false) {\n var dropArea = this.dropArea(),\n bgRatio = this.bgRatio();\n drag.removeClass('beingdragged').removeClass('unneeded');\n var dragXY = this.convertToBgImgXY(new Shapes.Point(drag.data('pagex'), drag.data('pagey')));\n if (isScaling) {\n drag.data('originX', dragXY.x / bgRatio).data('originY', dragXY.y / bgRatio);\n drag.css('left', dragXY.x).css('top', dragXY.y);\n } else {\n drag.data('originX', dragXY.x).data('originY', dragXY.y);\n drag.css('left', dragXY.x * bgRatio).css('top', dragXY.y * bgRatio);\n }\n // We need to save the original scale ratio for each draggable item.\n if (!initialLoad) {\n // Only set the scale ratio for a current being-dragged item, not for the initial loading.\n drag.data('scaleRatio', bgRatio);\n }\n dropArea.append(drag);\n this.handleElementScale(drag, 'left top');\n };\n\n /**\n * Clone the drag at the draghome area if needed.\n *\n * @param {jQuery} drag the item to place.\n */\n DragDropMarkersQuestion.prototype.cloneDragIfNeeded = function(drag) {\n var inputNode = this.getInput(drag),\n noOfDrags = Number(this.getClassnameNumericSuffix(inputNode, 'noofdrags')),\n displayedDragsInDropArea = this.getRoot().find('div.droparea .marker.choice' +\n this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true)).length,\n displayedDragsInDragHomes = this.getRoot().find('div.draghomes .marker.choice' +\n this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true)).not('.dragplaceholder').length;\n\n if ((this.isInfiniteDrag(drag) ||\n !this.isInfiniteDrag(drag) && displayedDragsInDropArea < noOfDrags) && displayedDragsInDragHomes === 0) {\n var dragClone = drag.clone();\n dragClone.addClass('unneeded')\n .css('top', '')\n .css('left', '')\n .css('transform', '');\n this.getDragClone(drag)\n .removeClass('active')\n .after(dragClone);\n questionManager.addEventHandlersToMarker(dragClone);\n }\n };\n\n /**\n * Remove the clone drag at the draghome area if needed.\n *\n * @param {jQuery} drag the item to place.\n */\n DragDropMarkersQuestion.prototype.removeDragIfNeeded = function(drag) {\n var dragsInHome = this.getRoot().find('div.draghomes .marker.choice' +\n this.getChoiceNoFromElement(drag) + this.getDragNoClass(drag, true)).not('.dragplaceholder');\n var displayedDrags = dragsInHome.length;\n while (displayedDrags > 1) {\n dragsInHome.first().remove();\n displayedDrags--;\n }\n };\n\n /**\n * Get the input belong to drag.\n *\n * @param {jQuery} drag the item to place.\n * @returns {jQuery} input element.\n */\n DragDropMarkersQuestion.prototype.getInput = function(drag) {\n var choiceNo = this.getChoiceNoFromElement(drag);\n return this.getRoot().find('input.choices.choice' + choiceNo);\n };\n\n /**\n * Return the background ratio.\n *\n * @returns {number} Background ratio.\n */\n DragDropMarkersQuestion.prototype.bgRatio = function() {\n var bgImg = this.bgImage();\n var bgImgNaturalWidth = bgImg.get(0).naturalWidth;\n var bgImgClientWidth = bgImg.width();\n\n return bgImgClientWidth / bgImgNaturalWidth;\n };\n\n /**\n * Scale the drag if needed.\n *\n * @param {jQuery} element the item to place.\n * @param {String} type scaling type\n */\n DragDropMarkersQuestion.prototype.handleElementScale = function(element, type) {\n var bgRatio = parseFloat(this.bgRatio());\n if (this.isPrinting) {\n bgRatio = 1;\n }\n $(element).css({\n '-webkit-transform': 'scale(' + bgRatio + ')',\n '-moz-transform': 'scale(' + bgRatio + ')',\n '-ms-transform': 'scale(' + bgRatio + ')',\n '-o-transform': 'scale(' + bgRatio + ')',\n 'transform': 'scale(' + bgRatio + ')',\n 'transform-origin': type\n });\n };\n\n /**\n * Check if the given drag is in infinite mode or not.\n *\n * @param {jQuery} drag The drag item need to check.\n */\n DragDropMarkersQuestion.prototype.isInfiniteDrag = function(drag) {\n return drag.hasClass('infinite');\n };\n\n /**\n * Waits until all images are loaded before calling setupQuestion().\n *\n * This function is called from the onLoad of each image, and also polls with\n * a time-out, because image on-loads are allegedly unreliable.\n */\n DragDropMarkersQuestion.prototype.waitForAllImagesToBeLoaded = function() {\n var thisQ = this;\n // This method may get called multiple times (via image on-loads or timeouts.\n // If we are already done, don't do it again.\n if (this.allImagesLoaded) {\n return;\n }\n\n // Clear any current timeout, if set.\n if (this.imageLoadingTimeoutId !== null) {\n clearTimeout(this.imageLoadingTimeoutId);\n }\n\n // If we have not yet loaded all images, set a timeout to\n // call ourselves again, since apparently images on-load\n // events are flakey.\n if (this.getNotYetLoadedImages().length > 0) {\n this.imageLoadingTimeoutId = setTimeout(function() {\n this.waitForAllImagesToBeLoaded();\n }, 100);\n return;\n }\n\n // We now have all images. Carry on, but only after giving the layout a chance to settle down.\n this.allImagesLoaded = true;\n this.cloneDrags();\n this.repositionDrags();\n this.drawDropzones();\n // Wait for all dynamic content loaded by filter to be completed.\n document.addEventListener(filterEvent.eventTypes.filterContentRenderingComplete, (elements) => {\n elements.detail.nodes.forEach((element) => {\n thisQ.changeAllMakerToFilteredContent(element);\n });\n });\n };\n\n /**\n * Change all the maker related to the item that has been changed by filter to correct size and content.\n *\n * @param {object} filteredElement the element has been modified by filter.\n */\n DragDropMarkersQuestion.prototype.changeAllMakerToFilteredContent = function(filteredElement) {\n let currentFilteredItem = $(filteredElement);\n const parentIsMarker = currentFilteredItem.parent().closest('span.marker');\n const isMarker = currentFilteredItem.hasClass('marker');\n const root = this.getRoot();\n // The filtered element or parent element should a drag or drop item.\n if (!parentIsMarker && !isMarker) {\n return;\n }\n if (parentIsMarker) {\n currentFilteredItem = currentFilteredItem.parent().closest('span.marker');\n }\n if (root.find(currentFilteredItem).length <= 0) {\n // If the maker doesn't belong to this question\n // In case we have multiple questions in the same page.\n return;\n }\n const dragNo = this.getDragNo(currentFilteredItem);\n const choiceNo = this.getChoiceNoFromElement(currentFilteredItem);\n const listOfContainerToBeModifed = [\n 'div.draghomes .marker:not(.dragplaceholder).dragno' + dragNo + '.choice' + choiceNo,\n 'div.droparea .marker:not(.dragplaceholder).dragno' + dragNo + '.choice' + choiceNo,\n 'div.draghomes .marker:not(.dragplaceholder).infinite.choice' + choiceNo,\n 'div.droparea .marker:not(.dragplaceholder).infinite.choice' + choiceNo\n ];\n let listOfModifiedDragDrop = [];\n // We want to keep all the handler and event for filtered item, so using clone is the only choice.\n const filteredDragDropClone = currentFilteredItem.clone();\n listOfContainerToBeModifed.forEach(function(selector) {\n root.find(selector).each(function(i, node) {\n const originalClass = $(node).attr('class');\n const originalStyle = $(node).attr('style');\n // Replace the class and style of the maker we want to replace for the clone.\n filteredDragDropClone.attr('class', originalClass);\n filteredDragDropClone.attr('style', originalStyle);\n // Add event for the clone.\n questionManager.addEventHandlersToMarker(filteredDragDropClone);\n // Insert into DOM.\n $(node).before(filteredDragDropClone);\n listOfModifiedDragDrop.push(node);\n });\n });\n listOfModifiedDragDrop.forEach(function(node) {\n $(node).remove();\n });\n };\n\n /**\n * Get any of the images in the drag-drop area that are not yet fully loaded.\n *\n * @returns {jQuery} those images.\n */\n DragDropMarkersQuestion.prototype.getNotYetLoadedImages = function() {\n return this.getRoot().find('.ddmarker img.dropbackground').not(function(i, imgNode) {\n return this.imageIsLoaded(imgNode);\n });\n };\n\n /**\n * Check if an image has loaded without errors.\n *\n * @param {HTMLImageElement} imgElement an image.\n * @returns {boolean} true if this image has loaded without errors.\n */\n DragDropMarkersQuestion.prototype.imageIsLoaded = function(imgElement) {\n return imgElement.complete && imgElement.naturalHeight !== 0;\n };\n\n /**\n * Singleton that tracks all the DragDropToTextQuestions on this page, and deals\n * with event dispatching.\n *\n * @type {Object}\n */\n var questionManager = {\n\n /**\n * {boolean} ensures that the event handlers are only initialised once per page.\n */\n eventHandlersInitialised: false,\n\n /**\n * {Object} ensures that the marker event handlers are only initialised once per question,\n * indexed by containerId (id on the .que div).\n */\n markerEventHandlersInitialised: {},\n\n /**\n * {boolean} is printing or not.\n */\n isPrinting: false,\n\n /**\n * {boolean} is keyboard navigation.\n */\n isKeyboardNavigation: false,\n\n /**\n * {Object} all the questions on this page, indexed by containerId (id on the .que div).\n */\n questions: {}, // An object containing all the information about each question on the page.\n\n /**\n * Initialise one question.\n *\n * @param {String} containerId the id of the div.que that contains this question.\n * @param {boolean} readOnly whether the question is read-only.\n * @param {Object[]} visibleDropZones data on any drop zones to draw as part of the feedback.\n */\n init: function(containerId, readOnly, visibleDropZones) {\n questionManager.questions[containerId] =\n new DragDropMarkersQuestion(containerId, readOnly, visibleDropZones);\n if (!questionManager.eventHandlersInitialised) {\n questionManager.setupEventHandlers();\n questionManager.eventHandlersInitialised = true;\n }\n if (!questionManager.markerEventHandlersInitialised.hasOwnProperty(containerId)) {\n questionManager.markerEventHandlersInitialised[containerId] = true;\n // We do not use the body event here to prevent the other event on Mobile device, such as scroll event.\n var questionContainer = document.getElementById(containerId);\n if (questionContainer.classList.contains('ddmarker') &&\n !questionContainer.classList.contains('qtype_ddmarker-readonly')) {\n // TODO: Convert all the jQuery selectors and events to native Javascript.\n questionManager.addEventHandlersToMarker($(questionContainer).find('div.draghomes .marker'));\n questionManager.addEventHandlersToMarker($(questionContainer).find('div.droparea .marker'));\n }\n }\n },\n\n /**\n * Set up the event handlers that make this question type work. (Done once per page.)\n */\n setupEventHandlers: function() {\n $(window).on('resize', function() {\n questionManager.handleWindowResize(false);\n });\n window.addEventListener('beforeprint', function() {\n questionManager.isPrinting = true;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n window.addEventListener('afterprint', function() {\n questionManager.isPrinting = false;\n questionManager.handleWindowResize(questionManager.isPrinting);\n });\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved();\n }, 100);\n },\n\n /**\n * Binding the event again for newly created element.\n *\n * @param {jQuery} element Element to bind the event\n */\n addEventHandlersToMarker: function(element) {\n element\n .on('mousedown touchstart', questionManager.handleDragStart)\n .on('keydown keypress', questionManager.handleKeyPress)\n .focusin(function(e) {\n questionManager.handleKeyboardFocus(e, true);\n })\n .focusout(function(e) {\n questionManager.handleKeyboardFocus(e, false);\n });\n },\n\n /**\n * Handle mouse down / touch start events on markers.\n * @param {Event} e the DOM event.\n */\n handleDragStart: function(e) {\n e.preventDefault();\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleDragStart(e);\n }\n },\n\n /**\n * Handle key down / press events on markers.\n * @param {Event} e\n */\n handleKeyPress: function(e) {\n var question = questionManager.getQuestionForEvent(e);\n if (question) {\n question.handleKeyPress(e);\n }\n },\n\n /**\n * Handle when the window is resized.\n * @param {boolean} isPrinting\n */\n handleWindowResize: function(isPrinting) {\n for (var containerId in questionManager.questions) {\n if (questionManager.questions.hasOwnProperty(containerId)) {\n questionManager.questions[containerId].isPrinting = isPrinting;\n questionManager.questions[containerId].handleResize();\n }\n }\n },\n\n /**\n * Handle focus lost events on markers.\n * @param {Event} e\n * @param {boolean} isNavigating\n */\n handleKeyboardFocus: function(e, isNavigating) {\n questionManager.isKeyboardNavigation = isNavigating;\n },\n\n /**\n * Sometimes, despite our best efforts, things change in a way that cannot\n * be specifically caught (e.g. dock expanding or collapsing in Boost).\n * Therefore, we need to periodically check everything is in the right position.\n */\n fixLayoutIfThingsMoved: function() {\n if (!questionManager.isKeyboardNavigation) {\n this.handleWindowResize(questionManager.isPrinting);\n }\n // We use setTimeout after finishing work, rather than setInterval,\n // in case positioning things is slow. We want 100 ms gap\n // between executions, not what setInterval does.\n setTimeout(function() {\n questionManager.fixLayoutIfThingsMoved(questionManager.isPrinting);\n }, 100);\n },\n\n /**\n * Given an event, work out which question it effects.\n * @param {Event} e the event.\n * @returns {DragDropMarkersQuestion|undefined} The question, or undefined.\n */\n getQuestionForEvent: function(e) {\n var containerId = $(e.currentTarget).closest('.que.ddmarker').attr('id');\n return questionManager.questions[containerId];\n },\n\n /**\n * Handle when the form is dirty.\n */\n handleFormDirty: function() {\n const responseForm = document.getElementById('responseform');\n FormChangeChecker.markFormAsDirty(responseForm);\n }\n };\n\n /**\n * @alias module:qtype_ddmarker/question\n */\n return {\n /**\n * Initialise one drag-drop markers question.\n *\n * @param {String} containerId id of the outer div for this question.\n * @param {String} bgImgUrl the URL of the background image.\n * @param {boolean} readOnly whether the question is being displayed read-only.\n * @param {String[]} visibleDropZones the geometry of any drop-zones to show.\n */\n init: questionManager.init\n };\n});\n"],"names":["define","$","dragDrop","Shapes","keys","FormChangeChecker","filterEvent","DragDropMarkersQuestion","containerId","readOnly","visibleDropZones","thisQ","this","shapes","shapeSVGs","isPrinting","questionAnswer","getRoot","addClass","allImagesLoaded","getNotYetLoadedImages","one","waitForAllImagesToBeLoaded","prototype","drawDropzones","length","bgImage","find","html","outerWidth","outerHeight","svg","nextColourIndex","dropZoneNo","colourClass","addDropzone","existingmarkertext","dropZone","shape","make","bgRatio","parse","coords","markertext","notifyFilterContentUpdated","remove","classnames","append","markerspan","handles","getHandlePositions","positionLeft","moveHandle","x","positionTop","y","css","data","position","left","top","handleElementScale","shapeSVG","makeSvg","setAttribute","repositionDrags","root","not","each","key","item","input","choiceNo","getChoiceNoFromElement","imageCoords","getImageCoords","drag","i","dragInDrop","clone","screenCoords","convertToWindowXY","sendDragToDrop","getDragClone","cloneDragIfNeeded","getQuestionAnsweredValues","result","inputNode","id","value","isQuestionInteracted","oldAnswer","newAnswer","isInteracted","JSON","stringify","Object","forEach","val","coordsStrings","split","Point","point","offset","convertToBgImgXY","coordsInBgImg","bgPosition","width","height","document","getElementById","handleDragStart","e","dragged","target","closest","prepare","start","hasClass","hiddenDrag","dragEnd","dragXY","placed","bgImgXY","sendDragHome","removeDragIfNeeded","saveCoordsForChoice","items","thiQ","join","questionManager","handleFormDirty","handleKeyPress","keyCode","arrowLeft","arrowRight","arrowDown","arrowUp","space","escape","preventDefault","constrainToBgImg","focus","windowxy","bgImg","Math","max","min","node","Number","getClassnameNumericSuffix","prefix","classes","attr","undefined","classesarr","index","RegExp","test","match","exec","handleResize","parseFloat","originCoords","updateSvg","markerSpan","cloneDrags","draghome","placeHolder","removeClass","getDragNoClass","before","getDragNo","includeSelector","className","isInfiniteDrag","dropArea","after","isScaling","initialLoad","getInput","noOfDrags","displayedDragsInDropArea","displayedDragsInDragHomes","dragClone","addEventHandlersToMarker","dragsInHome","displayedDrags","first","bgImgNaturalWidth","get","naturalWidth","element","type","imageLoadingTimeoutId","clearTimeout","setTimeout","addEventListener","eventTypes","filterContentRenderingComplete","elements","detail","nodes","changeAllMakerToFilteredContent","filteredElement","currentFilteredItem","parentIsMarker","parent","isMarker","dragNo","listOfContainerToBeModifed","listOfModifiedDragDrop","filteredDragDropClone","selector","originalClass","originalStyle","push","imgNode","imageIsLoaded","imgElement","complete","naturalHeight","eventHandlersInitialised","markerEventHandlersInitialised","isKeyboardNavigation","questions","init","setupEventHandlers","hasOwnProperty","questionContainer","classList","contains","window","on","handleWindowResize","fixLayoutIfThingsMoved","focusin","handleKeyboardFocus","focusout","question","getQuestionForEvent","isNavigating","currentTarget","responseForm","markFormAsDirty"],"mappings":"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"} \ No newline at end of file diff --git a/question/type/ddmarker/amd/src/question.js b/question/type/ddmarker/amd/src/question.js index 9d1a0474faf..9d746888f3d 100644 --- a/question/type/ddmarker/amd/src/question.js +++ b/question/type/ddmarker/amd/src/question.js @@ -908,10 +908,9 @@ define([ * * @param {String} containerId the id of the div.que that contains this question. * @param {boolean} readOnly whether the question is read-only. + * @param {Object[]} visibleDropZones data on any drop zones to draw as part of the feedback. */ - init: function(containerId, readOnly) { - const visibleDropZones = JSON.parse(document.querySelector('#' + containerId + ' .dropzones') - .dataset.visibledDropzones); + init: function(containerId, readOnly, visibleDropZones) { questionManager.questions[containerId] = new DragDropMarkersQuestion(containerId, readOnly, visibleDropZones); if (!questionManager.eventHandlersInitialised) { diff --git a/question/type/ddmarker/renderer.php b/question/type/ddmarker/renderer.php index 26765a313cb..a0aeaf84e75 100644 --- a/question/type/ddmarker/renderer.php +++ b/question/type/ddmarker/renderer.php @@ -60,19 +60,7 @@ class qtype_ddmarker_renderer extends qtype_ddtoimage_renderer_base { $output .= html_writer::img(self::get_url_for_image($qa, 'bgimage'), get_string('dropbackground', 'qtype_ddmarker'), ['class' => 'dropbackground img-fluid w-100']); - $visibledropzones = []; - if ($question->showmisplaced && $qa->get_state()->is_finished()) { - $visibledropzones = $question->get_drop_zones_without_hit($response); - if (count($visibledropzones) !== 0) { - $wrongpartsstringspans = []; - foreach ($visibledropzones as $visibledropzone) { - $visibledropzone->markertext = question_utils::format_question_fragment( - $visibledropzone->markertext, $this->page->context); - $wrongpartsstringspans[] = html_writer::span($visibledropzone->markertext, 'wrongpart'); - } - } - } - $output .= html_writer::div('', 'dropzones', ['data-visibled-dropzones' => json_encode($visibledropzones)]); + $output .= html_writer::div('', 'dropzones'); $output .= html_writer::div('', 'markertexts'); $output .= html_writer::end_div(); @@ -111,15 +99,26 @@ class qtype_ddmarker_renderer extends qtype_ddtoimage_renderer_base { $output .= html_writer::div($question->get_validation_error($qa->get_last_qt_data()), 'validationerror'); } - if (count($visibledropzones) !== 0) { - $wrongpartsstring = join(', ', $wrongpartsstringspans); - $output .= html_writer::span(get_string('followingarewrongandhighlighted', 'qtype_ddmarker', $wrongpartsstring), - 'wrongparts'); + $visibledropzones = []; + if ($question->showmisplaced && $qa->get_state()->is_finished()) { + $visibledropzones = $question->get_drop_zones_without_hit($response); + if (count($visibledropzones) !== 0) { + $wrongpartsstringspans = []; + foreach ($visibledropzones as $visibledropzone) { + $visibledropzone->markertext = question_utils::format_question_fragment( + $visibledropzone->markertext, $this->page->context); + $wrongpartsstringspans[] = html_writer::span($visibledropzone->markertext, 'wrongpart'); + } + $wrongpartsstring = join(', ', $wrongpartsstringspans); + $output .= html_writer::span(get_string('followingarewrongandhighlighted', 'qtype_ddmarker', $wrongpartsstring), + 'wrongparts'); + } } $output .= html_writer::div($hiddenfields, 'ddform'); + $this->page->requires->js_call_amd('qtype_ddmarker/question', 'init', - [$qa->get_outer_question_div_unique_id(), $options->readonly]); + [$qa->get_outer_question_div_unique_id(), $options->readonly, $visibledropzones]); return $output; } diff --git a/question/type/ddmarker/tests/walkthrough_test.php b/question/type/ddmarker/tests/walkthrough_test.php index 89f3f6bad74..38b8f29a989 100644 --- a/question/type/ddmarker/tests/walkthrough_test.php +++ b/question/type/ddmarker/tests/walkthrough_test.php @@ -96,18 +96,16 @@ final class walkthrough_test extends \qbehaviour_walkthrough_test_base { $this->check_current_mark(null); $this->check_current_output( - new \question_pattern_expectation( - '~
get_contains_draggable_marker_home_expectation(1, false), - $this->get_contains_draggable_marker_home_expectation(2, false), - $this->get_contains_draggable_marker_home_expectation(3, false), - $this->get_contains_hidden_expectation(1), - $this->get_contains_hidden_expectation(2), - $this->get_contains_hidden_expectation(3), - $this->get_contains_submit_button_expectation(true), - $this->get_does_not_contain_feedback_expectation(), - $this->get_tries_remaining_expectation(3), - $this->get_no_hint_visible_expectation()); + $this->get_contains_draggable_marker_home_expectation(1, false), + $this->get_contains_draggable_marker_home_expectation(2, false), + $this->get_contains_draggable_marker_home_expectation(3, false), + $this->get_contains_hidden_expectation(1), + $this->get_contains_hidden_expectation(2), + $this->get_contains_hidden_expectation(3), + $this->get_contains_submit_button_expectation(true), + $this->get_does_not_contain_feedback_expectation(), + $this->get_tries_remaining_expectation(3), + $this->get_no_hint_visible_expectation()); $completelywrong = array('c1' => '0,250', 'c2' => '100,250', 'c3' => '150,250'); // Save the wrong answer. @@ -323,7 +321,6 @@ final class walkthrough_test extends \qbehaviour_walkthrough_test_base { // Create a drag-and-drop question. $dd = \test_question_maker::make_question('ddmarker'); $dd->shufflechoices = false; - $dd->showmisplaced = true; $this->start_attempt_at_question($dd, 'deferredfeedback', 3); // Check the initial state. @@ -361,8 +358,6 @@ final class walkthrough_test extends \qbehaviour_walkthrough_test_base { $this->check_current_state(question_state::$gradedpartial); $this->check_current_mark(2); $this->check_current_output( - new \question_pattern_expectation( - '~
get_contains_draggable_marker_home_expectation(1, false), $this->get_contains_draggable_marker_home_expectation(2, false), $this->get_contains_draggable_marker_home_expectation(3, false),