mirror of
https://github.com/moodle/moodle.git
synced 2025-04-22 08:55:15 +02:00
MDL-78306 mod_quiz: Convert AMD modals to ESM
This commit is contained in:
Andrew Nicols
parent
c8a7a11230
commit
ecf49b2a19
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,10 +1,3 @@
|
||||
/**
|
||||
* Contain the logic for the question bank modal.
|
||||
*
|
||||
* @module mod_quiz/modal_quiz_question_bank
|
||||
* @copyright 2018 Ryan Wyllie <ryan@moodle.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
define("mod_quiz/modal_quiz_question_bank",["jquery","core/notification","core/modal","core/modal_events","core/modal_registry","core/fragment","core_form/changechecker"],(function($,Notification,Modal,ModalEvents,ModalRegistry,Fragment,FormChangeChecker){var registered=!1,SELECTORS_ADD_TO_QUIZ_CONTAINER="td.addtoquizaction",SELECTORS_ANCHOR="a[href]",SELECTORS_PREVIEW_CONTAINER="td.previewaction",SELECTORS_SEARCH_OPTIONS="#advancedsearch",SELECTORS_DISPLAY_OPTIONS="#displayoptions",SELECTORS_ADD_QUESTIONS_FORM="form#questionsubmit",ModalQuizQuestionBank=function(root){Modal.call(this,root),this.contextId=null,this.addOnPageId=null};return ModalQuizQuestionBank.TYPE="mod_quiz-quiz-question-bank",(ModalQuizQuestionBank.prototype=Object.create(Modal.prototype)).constructor=ModalQuizQuestionBank,ModalQuizQuestionBank.prototype.setContextId=function(id){this.contextId=id},ModalQuizQuestionBank.prototype.getContextId=function(){return this.contextId},ModalQuizQuestionBank.prototype.setAddOnPageId=function(id){this.addOnPageId=id},ModalQuizQuestionBank.prototype.getAddOnPageId=function(){return this.addOnPageId},ModalQuizQuestionBank.prototype.show=function(){return this.reloadBodyContent(window.location.search),Modal.prototype.show.call(this)},ModalQuizQuestionBank.prototype.reloadBodyContent=function(queryString){var promise=Fragment.loadFragment("mod_quiz","quiz_question_bank",this.getContextId(),{querystring:queryString}).fail(Notification.exception);this.setBody(promise)},ModalQuizQuestionBank.prototype.handleAddToQuizEvent=function(e,anchorElement){var href=anchorElement.attr("href")+"&addonpage="+this.getAddOnPageId();anchorElement.attr("href",href)},ModalQuizQuestionBank.prototype.handlePreviewContainerEvent=function(e,anchorElement){window.openpopup(e,{url:anchorElement.attr("href"),name:"questionpreview",options:["height=600","width=800","top=0","left=0","menubar=0","location=0","scrollbars","resizable","toolbar","status","directories=0","fullscreen=0","dependent"].join(",")})},ModalQuizQuestionBank.prototype.handleDisplayOptionFormEvent=function(e){e.stopPropagation(),e.preventDefault();var queryString="?"+$(e.target).closest(SELECTORS_DISPLAY_OPTIONS).serialize();this.reloadBodyContent(queryString)},ModalQuizQuestionBank.prototype.registerDisplayOptionListeners=function(){this.getModal().on("change",SELECTORS_DISPLAY_OPTIONS,function(e){$(e.target).attr("aria-autocomplete")||this.handleDisplayOptionFormEvent(e)}.bind(this)),this.getModal().on("submit",SELECTORS_DISPLAY_OPTIONS,function(e){this.handleDisplayOptionFormEvent(e)}.bind(this))},ModalQuizQuestionBank.prototype.registerEventListeners=function(){Modal.prototype.registerEventListeners.call(this),this.registerDisplayOptionListeners(),this.getModal().on("submit",SELECTORS_ADD_QUESTIONS_FORM,function(e){var formElement=$(e.currentTarget);$("<input />").attr("type","hidden").attr("name","addonpage").attr("value",this.getAddOnPageId()).appendTo(formElement)}.bind(this)),this.getModal().on("click",SELECTORS_ANCHOR,function(e){var anchorElement=$(e.currentTarget);anchorElement.closest(SELECTORS_ADD_TO_QUIZ_CONTAINER).length?this.handleAddToQuizEvent(e,anchorElement):anchorElement.closest(SELECTORS_PREVIEW_CONTAINER).length?this.handlePreviewContainerEvent(e,anchorElement):anchorElement.closest(SELECTORS_SEARCH_OPTIONS).length||(e.preventDefault(),this.reloadBodyContent(anchorElement.prop("search")))}.bind(this)),this.getRoot().on(ModalEvents.bodyRendered,(function(){FormChangeChecker.disableAllChecks()}))},registered||(ModalRegistry.register(ModalQuizQuestionBank.TYPE,ModalQuizQuestionBank,"core/modal"),registered=!0),ModalQuizQuestionBank}));
|
||||
define("mod_quiz/modal_quiz_question_bank",["exports","jquery","core/modal","core/fragment","core_form/changechecker","core/modal_events"],(function(_exports,_jquery,_modal,Fragment,FormChangeChecker,ModalEvents){function _getRequireWildcardCache(nodeInterop){if("function"!=typeof WeakMap)return null;var cacheBabelInterop=new WeakMap,cacheNodeInterop=new WeakMap;return(_getRequireWildcardCache=function(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop})(nodeInterop)}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule)return obj;if(null===obj||"object"!=typeof obj&&"function"!=typeof obj)return{default:obj};var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj))return cache.get(obj);var newObj={},hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj)if("default"!==key&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;desc&&(desc.get||desc.set)?Object.defineProperty(newObj,key,desc):newObj[key]=obj[key]}return newObj.default=obj,cache&&cache.set(obj,newObj),newObj}function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_jquery=_interopRequireDefault(_jquery),_modal=_interopRequireDefault(_modal),Fragment=_interopRequireWildcard(Fragment),FormChangeChecker=_interopRequireWildcard(FormChangeChecker),ModalEvents=_interopRequireWildcard(ModalEvents);const SELECTORS_ADD_TO_QUIZ_CONTAINER="td.addtoquizaction",SELECTORS_ANCHOR="a[href]",SELECTORS_PREVIEW_CONTAINER="td.previewaction",SELECTORS_SEARCH_OPTIONS="#advancedsearch",SELECTORS_DISPLAY_OPTIONS="#displayoptions",SELECTORS_ADD_QUESTIONS_FORM="form#questionsubmit";class ModalQuizQuestionBank extends _modal.default{constructor(root){super(root),this.contextId=null,this.addOnPageId=null}setContextId(id){this.contextId=id}getContextId(){return this.contextId}setAddOnPageId(id){this.addOnPageId=id}getAddOnPageId(){return this.addOnPageId}show(){return this.reloadBodyContent(window.location.search),super.show(this)}reloadBodyContent(querystring){this.setBody(Fragment.loadFragment("mod_quiz","quiz_question_bank",this.getContextId(),{querystring:querystring}))}handleAddToQuizEvent(e,anchorElement){const href=new URL(anchorElement.attr("href"));href.searchParams.set("addonpage",this.getAddOnPageId()),anchorElement.attr("href",href)}handlePreviewContainerEvent(e,anchorElement){window.openpopup(e,{url:anchorElement.attr("href"),name:"questionpreview",options:["height=600","width=800","top=0","left=0","menubar=0","location=0","scrollbars","resizable","toolbar","status","directories=0","fullscreen=0","dependent"].join(",")})}handleDisplayOptionFormEvent(e){e.stopPropagation(),e.preventDefault();const queryString="?"+(0,_jquery.default)(e.target).closest(SELECTORS_DISPLAY_OPTIONS).serialize();this.reloadBodyContent(queryString)}registerDisplayOptionListeners(){this.getModal().on("change",SELECTORS_DISPLAY_OPTIONS,(e=>{(0,_jquery.default)(e.target).attr("aria-autocomplete")||this.handleDisplayOptionFormEvent(e)})),this.getModal().on("submit",SELECTORS_DISPLAY_OPTIONS,(e=>{this.handleDisplayOptionFormEvent(e)}))}registerEventListeners(){super.registerEventListeners(this),this.registerDisplayOptionListeners(),this.getModal().on("submit",SELECTORS_ADD_QUESTIONS_FORM,(e=>{const formElement=(0,_jquery.default)(e.currentTarget);(0,_jquery.default)("<input />").attr("type","hidden").attr("name","addonpage").attr("value",this.getAddOnPageId()).appendTo(formElement)})),this.getModal().on("click",SELECTORS_ANCHOR,(e=>{const anchorElement=(0,_jquery.default)(e.currentTarget);anchorElement.closest(SELECTORS_ADD_TO_QUIZ_CONTAINER).length?this.handleAddToQuizEvent(e,anchorElement):anchorElement.closest(SELECTORS_PREVIEW_CONTAINER).length?this.handlePreviewContainerEvent(e,anchorElement):anchorElement.closest(SELECTORS_SEARCH_OPTIONS).length||(e.preventDefault(),this.reloadBodyContent(anchorElement.prop("search")))})),this.getRoot().on(ModalEvents.bodyRendered,(()=>{FormChangeChecker.disableAllChecks()}))}}var obj,key,value;return _exports.default=ModalQuizQuestionBank,value="mod_quiz-quiz-question-bank",(key="TYPE")in(obj=ModalQuizQuestionBank)?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,ModalQuizQuestionBank.registerModalType(),_exports.default}));
|
||||
|
||||
//# sourceMappingURL=modal_quiz_question_bank.min.js.map
|
||||
File diff suppressed because one or more lines are too long
@ -20,59 +20,45 @@
|
||||
* @copyright 2018 Ryan Wyllie <ryan@moodle.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
define([
|
||||
'jquery',
|
||||
'core/notification',
|
||||
'core/modal',
|
||||
'core/modal_events',
|
||||
'core/modal_registry',
|
||||
'core/fragment',
|
||||
'core/templates',
|
||||
'core_form/changechecker',
|
||||
],
|
||||
function(
|
||||
$,
|
||||
Notification,
|
||||
Modal,
|
||||
ModalEvents,
|
||||
ModalRegistry,
|
||||
Fragment,
|
||||
Templates,
|
||||
FormChangeChecker,
|
||||
) {
|
||||
|
||||
var registered = false;
|
||||
var SELECTORS = {
|
||||
EXISTING_CATEGORY_CONTAINER: '[data-region="existing-category-container"]',
|
||||
EXISTING_CATEGORY_FORM_ELEMENT: '#id_existingcategoryheader',
|
||||
NEW_CATEGORY_CONTAINER: '[data-region="new-category-container"]',
|
||||
NEW_CATEGORY_FORM_ELEMENT: '#id_newcategoryheader',
|
||||
TAB_CONTENT: '[data-region="tab-content"]',
|
||||
ADD_ON_PAGE_FORM_ELEMENT: '[name="addonpage"]',
|
||||
SUBMIT_BUTTON_ELEMENT: 'input[type="submit"]',
|
||||
CANCEL_BUTTON_ELEMENT: 'input[type="submit"][name="cancel"]',
|
||||
FORM_HEADER: 'legend',
|
||||
BUTTON_CONTAINER: '.fitem'
|
||||
};
|
||||
import $ from 'jquery';
|
||||
import Modal from 'core/modal';
|
||||
import * as Notification from 'core/notification';
|
||||
import * as Fragment from 'core/fragment';
|
||||
import * as Templates from 'core/templates';
|
||||
import * as FormChangeChecker from 'core_form/changechecker';
|
||||
|
||||
const SELECTORS = {
|
||||
EXISTING_CATEGORY_CONTAINER: '[data-region="existing-category-container"]',
|
||||
EXISTING_CATEGORY_FORM_ELEMENT: '#id_existingcategoryheader',
|
||||
NEW_CATEGORY_CONTAINER: '[data-region="new-category-container"]',
|
||||
NEW_CATEGORY_FORM_ELEMENT: '#id_newcategoryheader',
|
||||
TAB_CONTENT: '[data-region="tab-content"]',
|
||||
ADD_ON_PAGE_FORM_ELEMENT: '[name="addonpage"]',
|
||||
SUBMIT_BUTTON_ELEMENT: 'input[type="submit"]',
|
||||
CANCEL_BUTTON_ELEMENT: 'input[type="submit"][name="cancel"]',
|
||||
FORM_HEADER: 'legend',
|
||||
BUTTON_CONTAINER: '.fitem',
|
||||
};
|
||||
|
||||
export default class ModalAddRandomQuestion extends Modal {
|
||||
static TYPE = 'mod_quiz-quiz-add-random-question';
|
||||
static TEMPLATE = 'mod_quiz/modal_add_random_question';
|
||||
|
||||
/**
|
||||
* Constructor for the Modal.
|
||||
*
|
||||
* @param {object} root The root jQuery element for the modal
|
||||
*/
|
||||
var ModalAddRandomQuestion = function(root) {
|
||||
Modal.call(this, root);
|
||||
constructor(root) {
|
||||
super(root);
|
||||
this.contextId = null;
|
||||
this.addOnPageId = null;
|
||||
this.category = null;
|
||||
this.returnUrl = null;
|
||||
this.cmid = null;
|
||||
this.loadedForm = false;
|
||||
};
|
||||
|
||||
ModalAddRandomQuestion.TYPE = 'mod_quiz-quiz-add-random-question';
|
||||
ModalAddRandomQuestion.prototype = Object.create(Modal.prototype);
|
||||
ModalAddRandomQuestion.prototype.constructor = ModalAddRandomQuestion;
|
||||
}
|
||||
|
||||
/**
|
||||
* Save the Moodle context id that the question bank is being
|
||||
@ -81,9 +67,9 @@ function(
|
||||
* @method setContextId
|
||||
* @param {int} id
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.setContextId = function(id) {
|
||||
setContextId(id) {
|
||||
this.contextId = id;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve the saved Moodle context id.
|
||||
@ -91,9 +77,9 @@ function(
|
||||
* @method getContextId
|
||||
* @return {int}
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.getContextId = function() {
|
||||
getContextId() {
|
||||
return this.contextId;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the id of the page that the question should be added to
|
||||
@ -102,10 +88,10 @@ function(
|
||||
* @method setAddOnPageId
|
||||
* @param {int} id
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.setAddOnPageId = function(id) {
|
||||
setAddOnPageId(id) {
|
||||
this.addOnPageId = id;
|
||||
this.getBody().find(SELECTORS.ADD_ON_PAGE_FORM_ELEMENT).val(id);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the saved page id for the question to be added to.
|
||||
@ -113,9 +99,9 @@ function(
|
||||
* @method getAddOnPageId
|
||||
* @return {int}
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.getAddOnPageId = function() {
|
||||
getAddOnPageId() {
|
||||
return this.addOnPageId;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the category for this form. The category is a comma separated
|
||||
@ -124,9 +110,9 @@ function(
|
||||
* @method setCategory
|
||||
* @param {string} category
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.setCategory = function(category) {
|
||||
setCategory(category) {
|
||||
this.category = category;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the saved category.
|
||||
@ -134,9 +120,9 @@ function(
|
||||
* @method getCategory
|
||||
* @return {string}
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.getCategory = function() {
|
||||
getCategory() {
|
||||
return this.category;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the return URL for the form.
|
||||
@ -144,9 +130,9 @@ function(
|
||||
* @method setReturnUrl
|
||||
* @param {string} url
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.setReturnUrl = function(url) {
|
||||
setReturnUrl(url) {
|
||||
this.returnUrl = url;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the return URL for the form.
|
||||
@ -154,9 +140,9 @@ function(
|
||||
* @method getReturnUrl
|
||||
* @return {string}
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.getReturnUrl = function() {
|
||||
getReturnUrl() {
|
||||
return this.returnUrl;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the course module id for the form.
|
||||
@ -164,9 +150,9 @@ function(
|
||||
* @method setCMID
|
||||
* @param {int} id
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.setCMID = function(id) {
|
||||
setCMID(id) {
|
||||
this.cmid = id;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the course module id for the form.
|
||||
@ -174,9 +160,9 @@ function(
|
||||
* @method getCMID
|
||||
* @return {int}
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.getCMID = function() {
|
||||
getCMID() {
|
||||
return this.cmid;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Moves a given form element inside (a child of) a given tab element.
|
||||
@ -191,9 +177,9 @@ function(
|
||||
* @param {jquery} formElement The form element to move into the tab.
|
||||
* @param {jquey} tabElement The tab element for the form element to move into.
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.moveFormElementIntoTab = function(formElement, tabElement) {
|
||||
var submitButtons = formElement.find(SELECTORS.SUBMIT_BUTTON_ELEMENT);
|
||||
var footer = $('<div class="modal-footer mt-1" data-region="footer"></div>');
|
||||
moveFormElementIntoTab(formElement, tabElement) {
|
||||
const submitButtons = formElement.find(SELECTORS.SUBMIT_BUTTON_ELEMENT);
|
||||
const footer = $('<div class="modal-footer mt-1" data-region="footer"></div>');
|
||||
// Hide the header because the tabs show us which part of the form we're
|
||||
// looking at.
|
||||
formElement.find(SELECTORS.FORM_HEADER).addClass('hidden');
|
||||
@ -205,7 +191,7 @@ function(
|
||||
submitButtons.appendTo(footer);
|
||||
// Add the footer to the end of the category form element.
|
||||
footer.appendTo(formElement);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Empty the tab content container and move all tabs from the form into the
|
||||
@ -214,12 +200,12 @@ function(
|
||||
* @method moveTabsIntoTabContent
|
||||
* @param {jquery} form The form element.
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.moveTabsIntoTabContent = function(form) {
|
||||
moveTabsIntoTabContent(form) {
|
||||
// Empty it to remove the loading icon.
|
||||
var tabContent = this.getBody().find(SELECTORS.TAB_CONTENT).empty();
|
||||
const tabContent = this.getBody().find(SELECTORS.TAB_CONTENT).empty();
|
||||
// Make sure all tabs are inside the tab content element.
|
||||
form.find('[role="tabpanel"]').wrapAll(tabContent);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Make sure all of the tabs have a cancel button in their fotter to sit along
|
||||
@ -228,13 +214,13 @@ function(
|
||||
* @method moveCancelButtonToTabs
|
||||
* @param {jquey} form The form element.
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.moveCancelButtonToTabs = function(form) {
|
||||
var cancelButton = form.find(SELECTORS.CANCEL_BUTTON_ELEMENT).addClass('ml-1');
|
||||
var tabFooters = form.find('[data-region="footer"]');
|
||||
moveCancelButtonToTabs(form) {
|
||||
const cancelButton = form.find(SELECTORS.CANCEL_BUTTON_ELEMENT).addClass('ml-1');
|
||||
const tabFooters = form.find('[data-region="footer"]');
|
||||
// Remove the buttons container element.
|
||||
cancelButton.closest(SELECTORS.BUTTON_CONTAINER).remove();
|
||||
cancelButton.clone().appendTo(tabFooters);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Load the add random question form in a fragement and perform some transformation
|
||||
@ -243,7 +229,7 @@ function(
|
||||
* @method loadForm
|
||||
* @return {promise} Resolved with form HTML and JS.
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.loadForm = function() {
|
||||
loadForm() {
|
||||
return Fragment.loadFragment(
|
||||
'mod_quiz',
|
||||
'add_random_question_form',
|
||||
@ -255,12 +241,12 @@ function(
|
||||
cmid: this.getCMID()
|
||||
}
|
||||
)
|
||||
.then(function(html, js) {
|
||||
var form = $(html);
|
||||
var existingCategoryFormElement = form.find(SELECTORS.EXISTING_CATEGORY_FORM_ELEMENT);
|
||||
var existingCategoryTab = this.getBody().find(SELECTORS.EXISTING_CATEGORY_CONTAINER);
|
||||
var newCategoryFormElement = form.find(SELECTORS.NEW_CATEGORY_FORM_ELEMENT);
|
||||
var newCategoryTab = this.getBody().find(SELECTORS.NEW_CATEGORY_CONTAINER);
|
||||
.then((html, js) =>{
|
||||
const form = $(html);
|
||||
const existingCategoryFormElement = form.find(SELECTORS.EXISTING_CATEGORY_FORM_ELEMENT);
|
||||
const existingCategoryTab = this.getBody().find(SELECTORS.EXISTING_CATEGORY_CONTAINER);
|
||||
const newCategoryFormElement = form.find(SELECTORS.NEW_CATEGORY_FORM_ELEMENT);
|
||||
const newCategoryTab = this.getBody().find(SELECTORS.NEW_CATEGORY_CONTAINER);
|
||||
|
||||
// Transform the form into tabs for better rendering in the modal.
|
||||
this.moveFormElementIntoTab(existingCategoryFormElement, existingCategoryTab);
|
||||
@ -270,15 +256,15 @@ function(
|
||||
|
||||
Templates.replaceNode(this.getBody().find(SELECTORS.TAB_CONTENT), form, js);
|
||||
return;
|
||||
}.bind(this))
|
||||
.then(function() {
|
||||
})
|
||||
.then(() => {
|
||||
// Make sure the form change checker is disabled otherwise it'll stop the user from navigating away from the
|
||||
// page once the modal is hidden.
|
||||
FormChangeChecker.disableAllChecks();
|
||||
return;
|
||||
})
|
||||
.fail(Notification.exception);
|
||||
};
|
||||
.catch(Notification.exception);
|
||||
}
|
||||
|
||||
/**
|
||||
* Override the modal show function to load the form when this modal is first
|
||||
@ -286,26 +272,14 @@ function(
|
||||
*
|
||||
* @method show
|
||||
*/
|
||||
ModalAddRandomQuestion.prototype.show = function() {
|
||||
Modal.prototype.show.call(this);
|
||||
show() {
|
||||
super.show(this);
|
||||
|
||||
if (!this.loadedForm) {
|
||||
this.loadForm();
|
||||
this.loadedForm = true;
|
||||
}
|
||||
};
|
||||
|
||||
// Automatically register with the modal registry the first time this module is
|
||||
// imported so that you can create modals of this type using the modal factory.
|
||||
if (!registered) {
|
||||
ModalRegistry.register(
|
||||
ModalAddRandomQuestion.TYPE,
|
||||
ModalAddRandomQuestion,
|
||||
'mod_quiz/modal_add_random_question'
|
||||
);
|
||||
|
||||
registered = true;
|
||||
}
|
||||
}
|
||||
|
||||
return ModalAddRandomQuestion;
|
||||
});
|
||||
ModalAddRandomQuestion.registerModalType();
|
||||
|
||||
@ -20,50 +20,36 @@
|
||||
* @copyright 2018 Ryan Wyllie <ryan@moodle.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
define([
|
||||
'jquery',
|
||||
'core/notification',
|
||||
'core/modal',
|
||||
'core/modal_events',
|
||||
'core/modal_registry',
|
||||
'core/fragment',
|
||||
'core_form/changechecker',
|
||||
],
|
||||
function(
|
||||
$,
|
||||
Notification,
|
||||
Modal,
|
||||
ModalEvents,
|
||||
ModalRegistry,
|
||||
Fragment,
|
||||
FormChangeChecker,
|
||||
) {
|
||||
|
||||
var registered = false;
|
||||
var SELECTORS = {
|
||||
ADD_TO_QUIZ_CONTAINER: 'td.addtoquizaction',
|
||||
ANCHOR: 'a[href]',
|
||||
PREVIEW_CONTAINER: 'td.previewaction',
|
||||
SEARCH_OPTIONS: '#advancedsearch',
|
||||
DISPLAY_OPTIONS: '#displayoptions',
|
||||
ADD_QUESTIONS_FORM: 'form#questionsubmit',
|
||||
};
|
||||
import $ from 'jquery';
|
||||
import Modal from 'core/modal';
|
||||
import * as Fragment from 'core/fragment';
|
||||
import * as FormChangeChecker from 'core_form/changechecker';
|
||||
import * as ModalEvents from 'core/modal_events';
|
||||
|
||||
const SELECTORS = {
|
||||
ADD_TO_QUIZ_CONTAINER: 'td.addtoquizaction',
|
||||
ANCHOR: 'a[href]',
|
||||
PREVIEW_CONTAINER: 'td.previewaction',
|
||||
SEARCH_OPTIONS: '#advancedsearch',
|
||||
DISPLAY_OPTIONS: '#displayoptions',
|
||||
ADD_QUESTIONS_FORM: 'form#questionsubmit',
|
||||
};
|
||||
|
||||
export default class ModalQuizQuestionBank extends Modal {
|
||||
static TYPE = 'mod_quiz-quiz-question-bank';
|
||||
|
||||
/**
|
||||
* Constructor for the Modal.
|
||||
*
|
||||
* @param {object} root The root jQuery element for the modal
|
||||
*/
|
||||
var ModalQuizQuestionBank = function(root) {
|
||||
Modal.call(this, root);
|
||||
constructor(root) {
|
||||
super(root);
|
||||
|
||||
this.contextId = null;
|
||||
this.addOnPageId = null;
|
||||
};
|
||||
|
||||
ModalQuizQuestionBank.TYPE = 'mod_quiz-quiz-question-bank';
|
||||
ModalQuizQuestionBank.prototype = Object.create(Modal.prototype);
|
||||
ModalQuizQuestionBank.prototype.constructor = ModalQuizQuestionBank;
|
||||
}
|
||||
|
||||
/**
|
||||
* Save the Moodle context id that the question bank is being
|
||||
@ -72,9 +58,9 @@ function(
|
||||
* @method setContextId
|
||||
* @param {int} id
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.setContextId = function(id) {
|
||||
setContextId(id) {
|
||||
this.contextId = id;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve the saved Moodle context id.
|
||||
@ -82,9 +68,9 @@ function(
|
||||
* @method getContextId
|
||||
* @return {int}
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.getContextId = function() {
|
||||
getContextId() {
|
||||
return this.contextId;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the id of the page that the question should be added to
|
||||
@ -93,9 +79,9 @@ function(
|
||||
* @method setAddOnPageId
|
||||
* @param {int} id
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.setAddOnPageId = function(id) {
|
||||
setAddOnPageId(id) {
|
||||
this.addOnPageId = id;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the saved page id for the question to be added it.
|
||||
@ -103,9 +89,9 @@ function(
|
||||
* @method getAddOnPageId
|
||||
* @return {int}
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.getAddOnPageId = function() {
|
||||
getAddOnPageId() {
|
||||
return this.addOnPageId;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Override the parent show function.
|
||||
@ -117,10 +103,10 @@ function(
|
||||
* @method show
|
||||
* @return {void}
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.show = function() {
|
||||
show() {
|
||||
this.reloadBodyContent(window.location.search);
|
||||
return Modal.prototype.show.call(this);
|
||||
};
|
||||
return super.show(this);
|
||||
}
|
||||
|
||||
/**
|
||||
* Replaces the current body contents with a new version of the question
|
||||
@ -130,21 +116,19 @@ function(
|
||||
* query string.
|
||||
*
|
||||
* @method reloadBodyContent
|
||||
* @param {string} queryString URL encoded string.
|
||||
* @param {string} querystring URL encoded string.
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.reloadBodyContent = function(queryString) {
|
||||
reloadBodyContent(querystring) {
|
||||
// Load the question bank fragment to be displayed in the modal.
|
||||
var promise = Fragment.loadFragment(
|
||||
this.setBody(Fragment.loadFragment(
|
||||
'mod_quiz',
|
||||
'quiz_question_bank',
|
||||
this.getContextId(),
|
||||
{
|
||||
querystring: queryString
|
||||
querystring,
|
||||
}
|
||||
).fail(Notification.exception);
|
||||
|
||||
this.setBody(promise);
|
||||
};
|
||||
));
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the URL of the anchor element that the user clicked on to make
|
||||
@ -154,14 +138,15 @@ function(
|
||||
* @param {event} e A JavaScript event
|
||||
* @param {object} anchorElement The anchor element that was triggered
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.handleAddToQuizEvent = function(e, anchorElement) {
|
||||
handleAddToQuizEvent(e, anchorElement) {
|
||||
// If the user clicks the plus icon to add the question to the page
|
||||
// directly then we need to intercept the click in order to adjust the
|
||||
// href and include the correct add on page id before the page is
|
||||
// redirected.
|
||||
var href = anchorElement.attr('href') + '&addonpage=' + this.getAddOnPageId();
|
||||
const href = new URL(anchorElement.attr('href'));
|
||||
href.searchParams.set('addonpage', this.getAddOnPageId());
|
||||
anchorElement.attr('href', href);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Open a popup window to show the preview of the question.
|
||||
@ -170,8 +155,8 @@ function(
|
||||
* @param {event} e A JavaScript event
|
||||
* @param {object} anchorElement The anchor element that was triggered
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.handlePreviewContainerEvent = function(e, anchorElement) {
|
||||
var popupOptions = [
|
||||
handlePreviewContainerEvent(e, anchorElement) {
|
||||
const popupOptions = [
|
||||
'height=600',
|
||||
'width=800',
|
||||
'top=0',
|
||||
@ -184,14 +169,14 @@ function(
|
||||
'status',
|
||||
'directories=0',
|
||||
'fullscreen=0',
|
||||
'dependent'
|
||||
'dependent',
|
||||
];
|
||||
window.openpopup(e, {
|
||||
url: anchorElement.attr('href'),
|
||||
name: 'questionpreview',
|
||||
options: popupOptions.join(',')
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Reload the modal body with the new display options the user has selected.
|
||||
@ -202,16 +187,16 @@ function(
|
||||
* @method handleDisplayOptionFormEvent
|
||||
* @param {event} e A JavaScript event
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.handleDisplayOptionFormEvent = function(e) {
|
||||
handleDisplayOptionFormEvent(e) {
|
||||
// Stop propagation to prevent other wild event handlers
|
||||
// from submitting the form on change.
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
|
||||
var form = $(e.target).closest(SELECTORS.DISPLAY_OPTIONS);
|
||||
var queryString = '?' + form.serialize();
|
||||
const form = $(e.target).closest(SELECTORS.DISPLAY_OPTIONS);
|
||||
const queryString = '?' + form.serialize();
|
||||
this.reloadBodyContent(queryString);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Listen for changes to the display options form.
|
||||
@ -224,11 +209,11 @@ function(
|
||||
*
|
||||
* @method registerDisplayOptionListeners
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.registerDisplayOptionListeners = function() {
|
||||
registerDisplayOptionListeners() {
|
||||
// Listen for changes to the display options form.
|
||||
this.getModal().on('change', SELECTORS.DISPLAY_OPTIONS, function(e) {
|
||||
this.getModal().on('change', SELECTORS.DISPLAY_OPTIONS, (e) => {
|
||||
// Get the element that was changed.
|
||||
var modifiedElement = $(e.target);
|
||||
const modifiedElement = $(e.target);
|
||||
if (modifiedElement.attr('aria-autocomplete')) {
|
||||
// If the element that was change is the autocomplete
|
||||
// input then we should ignore it because that is for
|
||||
@ -237,41 +222,41 @@ function(
|
||||
}
|
||||
|
||||
this.handleDisplayOptionFormEvent(e);
|
||||
}.bind(this));
|
||||
});
|
||||
|
||||
// Listen for the display options form submission because the tags
|
||||
// filter will submit the form when it is changed.
|
||||
this.getModal().on('submit', SELECTORS.DISPLAY_OPTIONS, function(e) {
|
||||
this.getModal().on('submit', SELECTORS.DISPLAY_OPTIONS, (e) => {
|
||||
this.handleDisplayOptionFormEvent(e);
|
||||
}.bind(this));
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Set up all of the event handling for the modal.
|
||||
*
|
||||
* @method registerEventListeners
|
||||
*/
|
||||
ModalQuizQuestionBank.prototype.registerEventListeners = function() {
|
||||
registerEventListeners() {
|
||||
// Apply parent event listeners.
|
||||
Modal.prototype.registerEventListeners.call(this);
|
||||
super.registerEventListeners(this);
|
||||
|
||||
// Set up the event handlers for all of the display options.
|
||||
this.registerDisplayOptionListeners();
|
||||
|
||||
this.getModal().on('submit', SELECTORS.ADD_QUESTIONS_FORM, function(e) {
|
||||
this.getModal().on('submit', SELECTORS.ADD_QUESTIONS_FORM, (e) => {
|
||||
// If the user clicks on the "Add selected questions to the quiz" button to add some questions to the page
|
||||
// then we need to intercept the submit in order to include the correct "add on page id" before the form is
|
||||
// submitted.
|
||||
var formElement = $(e.currentTarget);
|
||||
const formElement = $(e.currentTarget);
|
||||
|
||||
$('<input />').attr('type', 'hidden')
|
||||
.attr('name', "addonpage")
|
||||
.attr('value', this.getAddOnPageId())
|
||||
.appendTo(formElement);
|
||||
}.bind(this));
|
||||
});
|
||||
|
||||
this.getModal().on('click', SELECTORS.ANCHOR, function(e) {
|
||||
var anchorElement = $(e.currentTarget);
|
||||
this.getModal().on('click', SELECTORS.ANCHOR, (e) => {
|
||||
const anchorElement = $(e.currentTarget);
|
||||
|
||||
// If the anchor element was the add to quiz link.
|
||||
if (anchorElement.closest(SELECTORS.ADD_TO_QUIZ_CONTAINER).length) {
|
||||
@ -294,27 +279,15 @@ function(
|
||||
// Anything else means reload the pop-up contents.
|
||||
e.preventDefault();
|
||||
this.reloadBodyContent(anchorElement.prop('search'));
|
||||
}.bind(this));
|
||||
});
|
||||
|
||||
// Disable the form change checker when the body is rendered.
|
||||
this.getRoot().on(ModalEvents.bodyRendered, function() {
|
||||
this.getRoot().on(ModalEvents.bodyRendered, () => {
|
||||
// Make sure the form change checker is disabled otherwise it'll stop the user from navigating away from the
|
||||
// page once the modal is hidden.
|
||||
FormChangeChecker.disableAllChecks();
|
||||
});
|
||||
};
|
||||
|
||||
// Automatically register with the modal registry the first time this module is
|
||||
// imported so that you can create modals of this type using the modal factory.
|
||||
if (!registered) {
|
||||
ModalRegistry.register(
|
||||
ModalQuizQuestionBank.TYPE,
|
||||
ModalQuizQuestionBank,
|
||||
'core/modal'
|
||||
);
|
||||
|
||||
registered = true;
|
||||
}
|
||||
}
|
||||
|
||||
return ModalQuizQuestionBank;
|
||||
});
|
||||
ModalQuizQuestionBank.registerModalType();
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user