moodle/moodle
3
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-08-04 08:26:37 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

MDL-78306 core: Convert modal_factory to ESM

Browse source
This commit is contained in:
Andrew Nicols 2023-05-18 15:35:47 +08:00
parent ecf49b2a19
commit c6c871e2ce
No known key found for this signature in database
GPG key ID: 6D1E3157C8CFBF14
3 changed files with 193 additions and 197 deletions
Download patch file Download diff file Expand all files Collapse all files

4
lib/amd/build/modal_factory.min.js vendored
View file

@ -1,10 +1,10 @@
define("core/modal_factory",["exports","jquery","core/modal_events","core/modal_registry","core/modal","core/modal_save_cancel","core/modal_delete_cancel","core/modal_cancel","core/local/modal/alert","core/templates","core/notification","core/custom_interaction_events","core/pending"],(function(_exports,_jquery,_modal_events,ModalRegistry,_modal,_modal_save_cancel,_modal_delete_cancel,_modal_cancel,_alert,Templates,Notification,CustomEvents,_pending){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}}
/** /**
* Create a modal. * Create a modal.
* *
* @module core/modal_factory * @module core/modal_factory
* @copyright 2016 Ryan Wyllie <ryan@moodle.com> * @copyright 2016 Ryan Wyllie <ryan@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/ */Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.types=_exports.default=_exports.create=void 0,_jquery=_interopRequireDefault(_jquery),_modal_events=_interopRequireDefault(_modal_events),ModalRegistry=_interopRequireWildcard(ModalRegistry),_modal=_interopRequireDefault(_modal),_modal_save_cancel=_interopRequireDefault(_modal_save_cancel),_modal_delete_cancel=_interopRequireDefault(_modal_delete_cancel),_modal_cancel=_interopRequireDefault(_modal_cancel),_alert=_interopRequireDefault(_alert),Templates=_interopRequireWildcard(Templates),Notification=_interopRequireWildcard(Notification),CustomEvents=_interopRequireWildcard(CustomEvents),_pending=_interopRequireDefault(_pending);const types={DEFAULT:"DEFAULT",SAVE_CANCEL:_modal_save_cancel.default.TYPE,DELETE_CANCEL:_modal_delete_cancel.default.TYPE,CANCEL:_modal_cancel.default.TYPE,ALERT:_alert.default.TYPE};_exports.types=types,ModalRegistry.register(types.DEFAULT,_modal.default,_modal.default.TEMPLATE);const createFromType=(registryConf,templateContext)=>{const templateName=registryConf.template;return Templates.render(templateName,templateContext).then((html=>((registryConf,modalElement)=>(modalElement=(0,_jquery.default)(modalElement),new(0,registryConf.module)(modalElement)))(registryConf,(0,_jquery.default)(html))))},create=(modalConfig,triggerElement)=>{const type=modalConfig.type||types.DEFAULT,isLarge=!!modalConfig.large,isScrollable=!modalConfig.hasOwnProperty("scrollable")||modalConfig.scrollable,registryConf=ModalRegistry.get(type);registryConf||Notification.exception({message:"Unable to find modal of type: "+type});const templateContext=modalConfig.templateContext||{},modalPromise=createFromType(registryConf,templateContext).then((modal=>(void 0!==modalConfig.title&&modal.setTitle(modalConfig.title),void 0!==modalConfig.body&&modal.setBody(modalConfig.body),void 0!==modalConfig.footer&&modal.setFooter(modalConfig.footer),modalConfig.buttons&&Object.entries(modalConfig.buttons).forEach((function(_ref){let[key,value]=_ref;modal.setButtonText(key,value)})),isLarge&&modal.setLarge(),void 0!==modalConfig.removeOnClose&&modal.setRemoveOnClose(modalConfig.removeOnClose),modal.setScrollable(isScrollable),modal)));return void 0!==triggerElement&&((modalPromise,triggerElement,modalConfig)=>{let actualTriggerElement=null;const hasPreShowCallback="function"==typeof modalConfig.preShowCallback,triggeredCallback=(e,data)=>{const pendingPromise=new _pending.default("core/modal_factory:setUpTrigger:triggeredCallback");actualTriggerElement=(0,_jquery.default)(e.currentTarget),modalPromise.then((function(modal){return hasPreShowCallback&&modalConfig.preShowCallback(actualTriggerElement,modal),modal.show(),modal})).then(pendingPromise.resolve),data.originalEvent.preventDefault()};if(Array.isArray(triggerElement)){const selector=triggerElement[1];triggerElement=triggerElement[0],CustomEvents.define(triggerElement,[CustomEvents.events.activate]),triggerElement.on(CustomEvents.events.activate,selector,triggeredCallback)}else CustomEvents.define(triggerElement,[CustomEvents.events.activate]),triggerElement.on(CustomEvents.events.activate,triggeredCallback);modalPromise.then((function(modal){return modal.getRoot().on(_modal_events.default.hidden,(function(){null!==actualTriggerElement&&actualTriggerElement.focus()})),modal}))})(modalPromise,triggerElement,modalConfig),modalPromise};_exports.create=create;var _default={create:create,types:types};return _exports.default=_default,_exports.default}));
define("core/modal_factory",["jquery","core/modal_events","core/modal_registry","core/modal","core/modal_save_cancel","core/modal_delete_cancel","core/modal_cancel","core/local/modal/alert","core/templates","core/notification","core/custom_interaction_events","core/pending"],(function($,ModalEvents,ModalRegistry,Modal,ModalSaveCancel,ModalDeleteCancel,ModalCancel,ModalAlert,Templates,Notification,CustomEvents,Pending){var TYPES={DEFAULT:"DEFAULT",SAVE_CANCEL:ModalSaveCancel.TYPE,DELETE_CANCEL:ModalDeleteCancel.TYPE,CANCEL:ModalCancel.TYPE,ALERT:ModalAlert.TYPE};ModalRegistry.register(TYPES.DEFAULT,Modal,Modal.TEMPLATE);var createFromType=function(registryConf,templateContext){var templateName=registryConf.template,modalPromise=Templates.render(templateName,templateContext).then((function(html){var modalElement=$(html);return function(registryConf,modalElement){return modalElement=$(modalElement),new(0,registryConf.module)(modalElement)}(registryConf,modalElement)})).fail(Notification.exception);return modalPromise};return{create:function(modalConfig,triggerElement){var registryConf,type=modalConfig.type||TYPES.DEFAULT,isLarge=!!modalConfig.large,isScrollable=!modalConfig.hasOwnProperty("scrollable")||modalConfig.scrollable,templateContext={};(registryConf=ModalRegistry.get(type))||Notification.exception({message:"Unable to find modal of type: "+type}),void 0!==modalConfig.templateContext&&(templateContext=modalConfig.templateContext);var modalPromise=createFromType(registryConf,templateContext).then((function(modal){return void 0!==modalConfig.title&&modal.setTitle(modalConfig.title),void 0!==modalConfig.body&&modal.setBody(modalConfig.body),void 0!==modalConfig.footer&&modal.setFooter(modalConfig.footer),modalConfig.buttons&&Object.entries(modalConfig.buttons).forEach((function(_ref){let[key,value]=_ref;modal.setButtonText(key,value)})),isLarge&&modal.setLarge(),void 0!==modalConfig.removeOnClose&&modal.setRemoveOnClose(modalConfig.removeOnClose),modal.setScrollable(isScrollable),modal}));return void 0!==triggerElement&&function(modalPromise,triggerElement,modalConfig){var actualTriggerElement=null,hasPreShowCallback="function"==typeof modalConfig.preShowCallback,triggeredCallback=function(e,data){var pendingPromise=new Pending("core/modal_factory:setUpTrigger:triggeredCallback");actualTriggerElement=$(e.currentTarget),modalPromise.then((function(modal){return hasPreShowCallback&&modalConfig.preShowCallback(actualTriggerElement,modal),modal.show(),modal})).then(pendingPromise.resolve),data.originalEvent.preventDefault()};if(Array.isArray(triggerElement)){var selector=triggerElement[1];triggerElement=triggerElement[0],CustomEvents.define(triggerElement,[CustomEvents.events.activate]),triggerElement.on(CustomEvents.events.activate,selector,triggeredCallback)}else CustomEvents.define(triggerElement,[CustomEvents.events.activate]),triggerElement.on(CustomEvents.events.activate,triggeredCallback);modalPromise.then((function(modal){return modal.getRoot().on(ModalEvents.hidden,(function(){null!==actualTriggerElement&&actualTriggerElement.focus()})),modal}))}(modalPromise,triggerElement,modalConfig),modalPromise},types:TYPES}}));
//# sourceMappingURL=modal_factory.min.js.map //# sourceMappingURL=modal_factory.min.js.map

2
lib/amd/build/modal_factory.min.js.map
View file

File diff suppressed because one or more lines are too long

104
lib/amd/src/modal_factory.js
View file

@ -20,26 +20,30 @@
* @copyright 2016 Ryan Wyllie <ryan@moodle.com> * @copyright 2016 Ryan Wyllie <ryan@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/ */
define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
'core/modal_save_cancel', 'core/modal_delete_cancel', 'core/modal_cancel', 'core/local/modal/alert', import $ from 'jquery';
'core/templates', 'core/notification', 'core/custom_interaction_events', import ModalEvents from 'core/modal_events';
'core/pending'], import * as ModalRegistry from 'core/modal_registry';
function($, ModalEvents, ModalRegistry, Modal, ModalSaveCancel, ModalDeleteCancel, import Modal from 'core/modal';
ModalCancel, ModalAlert, Templates, Notification, CustomEvents, Pending) { import ModalSaveCancel from 'core/modal_save_cancel';
import ModalDeleteCancel from 'core/modal_delete_cancel';
import ModalCancel from 'core/modal_cancel';
import ModalAlert from 'core/local/modal/alert';
import * as Templates from 'core/templates';
import * as Notification from 'core/notification';
import * as CustomEvents from 'core/custom_interaction_events';
import Pending from 'core/pending';
/** /**
* The available types of modals. * The available standard modals.
* *
* @constant
* @static
* @public
* @property {String} DEFAULT The default modal * @property {String} DEFAULT The default modal
* @property {String} SAVE_CANCEL A modal which can be used to either save, or cancel. * @property {String} SAVE_CANCEL A modal which can be used to either save, or cancel.
* @property {String} DELETE_CANCEL A modal which can be used to either delete, or cancel. * @property {String} DELETE_CANCEL A modal which can be used to either delete, or cancel.
* @property {String} CANCEL A modal which displayed a cancel button * @property {String} CANCEL A modal which displayed a cancel button
* @property {String} ALERT An information modal which only displays information. * @property {String} ALERT An information modal which only displays information.
*/ */
var TYPES = { export const types = {
DEFAULT: 'DEFAULT', DEFAULT: 'DEFAULT',
SAVE_CANCEL: ModalSaveCancel.TYPE, SAVE_CANCEL: ModalSaveCancel.TYPE,
DELETE_CANCEL: ModalDeleteCancel.TYPE, DELETE_CANCEL: ModalDeleteCancel.TYPE,
@ -47,8 +51,10 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
ALERT: ModalAlert.TYPE, ALERT: ModalAlert.TYPE,
}; };
// Register the common set of modals. // Most modals are self-registering.
ModalRegistry.register(TYPES.DEFAULT, Modal, Modal.TEMPLATE); // We do not self-register the base Modal because we do not want to define a default TYPE
// on the class that every other modal extends.
ModalRegistry.register(types.DEFAULT, Modal, Modal.TEMPLATE);
/** /**
* Set up the events required to show the modal and return focus when the modal * Set up the events required to show the modal and return focus when the modal
@ -60,16 +66,18 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
* @param {object} triggerElement The jQuery element to open the modal * @param {object} triggerElement The jQuery element to open the modal
* @param {object} modalConfig The modal configuration given to the factory * @param {object} modalConfig The modal configuration given to the factory
*/ */
var setUpTrigger = function(modalPromise, triggerElement, modalConfig) { const setUpTrigger = (modalPromise, triggerElement, modalConfig) => {
// The element that actually shows the modal. // The element that actually shows the modal.
var actualTriggerElement = null; let actualTriggerElement = null;
// Check if the client has provided a callback function to be called // Check if the client has provided a callback function to be called
// before the modal is displayed. // before the modal is displayed.
var hasPreShowCallback = (typeof modalConfig.preShowCallback == 'function'); const hasPreShowCallback = (typeof modalConfig.preShowCallback == 'function');
// Function to handle the trigger element being activated. // Function to handle the trigger element being activated.
var triggeredCallback = function(e, data) { const triggeredCallback = (e, data) => {
var pendingPromise = new Pending('core/modal_factory:setUpTrigger:triggeredCallback'); const pendingPromise = new Pending('core/modal_factory:setUpTrigger:triggeredCallback');
actualTriggerElement = $(e.currentTarget); actualTriggerElement = $(e.currentTarget);
// eslint-disable-next-line promise/catch-or-return
modalPromise.then(function(modal) { modalPromise.then(function(modal) {
if (hasPreShowCallback) { if (hasPreShowCallback) {
// If the client provided a pre-show callback then execute // If the client provided a pre-show callback then execute
@ -89,7 +97,7 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
// element + selector pair to create a delegated event handler to trigger // element + selector pair to create a delegated event handler to trigger
// the modal. // the modal.
if (Array.isArray(triggerElement)) { if (Array.isArray(triggerElement)) {
var selector = triggerElement[1]; const selector = triggerElement[1];
triggerElement = triggerElement[0]; triggerElement = triggerElement[0];
CustomEvents.define(triggerElement, [CustomEvents.events.activate]); CustomEvents.define(triggerElement, [CustomEvents.events.activate]);
@ -99,6 +107,7 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
triggerElement.on(CustomEvents.events.activate, triggeredCallback); triggerElement.on(CustomEvents.events.activate, triggeredCallback);
} }
// eslint-disable-next-line promise/catch-or-return
modalPromise.then(function(modal) { modalPromise.then(function(modal) {
modal.getRoot().on(ModalEvents.hidden, function() { modal.getRoot().on(ModalEvents.hidden, function() {
// Focus on the trigger element that actually launched the modal. // Focus on the trigger element that actually launched the modal.
@ -121,10 +130,10 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
* @param {object} modalElement The modal HTML jQuery object * @param {object} modalElement The modal HTML jQuery object
* @return {object} Modal instance * @return {object} Modal instance
*/ */
var createFromElement = function(registryConf, modalElement) { const createFromElement = (registryConf, modalElement) => {
modalElement = $(modalElement); modalElement = $(modalElement);
var Module = registryConf.module; const Module = registryConf.module;
var modal = new Module(modalElement); const modal = new Module(modalElement);
return modal; return modal;
}; };
@ -139,17 +148,10 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
* @param {object} templateContext The context to render the template with * @param {object} templateContext The context to render the template with
* @returns {promise} Resolved with a Modal instance * @returns {promise} Resolved with a Modal instance
*/ */
var createFromType = function(registryConf, templateContext) { const createFromType = (registryConf, templateContext) => {
var templateName = registryConf.template; const templateName = registryConf.template;
return Templates.render(templateName, templateContext)
var modalPromise = Templates.render(templateName, templateContext) .then((html) => createFromElement(registryConf, $(html)));
.then(function(html) {
var modalElement = $(html);
return createFromElement(registryConf, modalElement);
})
.fail(Notification.exception);
return modalPromise;
}; };
/** /**
@ -160,35 +162,30 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
* @param {object} triggerElement The trigger HTML jQuery object * @param {object} triggerElement The trigger HTML jQuery object
* @return {promise} Resolved with a Modal instance * @return {promise} Resolved with a Modal instance
*/ */
var create = function(modalConfig, triggerElement) { export const create = (modalConfig, triggerElement) => {
var type = modalConfig.type || TYPES.DEFAULT; const type = modalConfig.type || types.DEFAULT;
var isLarge = modalConfig.large ? true : false; const isLarge = modalConfig.large ? true : false;
// If 'scrollable' is not configured, set the modal to be scrollable by default. // If 'scrollable' is not configured, set the modal to be scrollable by default.
var isScrollable = modalConfig.hasOwnProperty('scrollable') ? modalConfig.scrollable : true; const isScrollable = modalConfig.hasOwnProperty('scrollable') ? modalConfig.scrollable : true;
var registryConf = null;
var templateContext = {};
registryConf = ModalRegistry.get(type);
const registryConf = ModalRegistry.get(type);
if (!registryConf) { if (!registryConf) {
Notification.exception({message: 'Unable to find modal of type: ' + type}); Notification.exception({message: 'Unable to find modal of type: ' + type});
} }
if (typeof modalConfig.templateContext != 'undefined') { const templateContext = modalConfig.templateContext || {};
templateContext = modalConfig.templateContext;
}
var modalPromise = createFromType(registryConf, templateContext) const modalPromise = createFromType(registryConf, templateContext)
.then(function(modal) { .then((modal) => {
if (typeof modalConfig.title != 'undefined') { if (typeof modalConfig.title !== 'undefined') {
modal.setTitle(modalConfig.title); modal.setTitle(modalConfig.title);
} }
if (typeof modalConfig.body != 'undefined') { if (typeof modalConfig.body !== 'undefined') {
modal.setBody(modalConfig.body); modal.setBody(modalConfig.body);
} }
if (typeof modalConfig.footer != 'undefined') { if (typeof modalConfig.footer !== 'undefined') {
modal.setFooter(modalConfig.footer); modal.setFooter(modalConfig.footer);
} }
@ -212,15 +209,14 @@ define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
return modal; return modal;
}); });
if (typeof triggerElement != 'undefined') { if (typeof triggerElement !== 'undefined') {
setUpTrigger(modalPromise, triggerElement, modalConfig); setUpTrigger(modalPromise, triggerElement, modalConfig);
} }
return modalPromise; return modalPromise;
}; };
return { export default {
create: create, create,
types: TYPES, types,
}; };
});