mirror of
https://github.com/moodle/moodle.git
synced 2025-08-04 00:16:46 +02:00
MDL-78306 core: Convert modal_backdrop to ESM
This commit is contained in:
Andrew Nicols
parent
a571b7c8bf
commit
80780f755a
3 changed files with 43 additions and 47 deletions
9
lib/amd/build/modal_backdrop.min.js
vendored
9
lib/amd/build/modal_backdrop.min.js
vendored
|
|
@ -1,10 +1,3 @@
|
|||
/**
|
||||
* Contain the logic for modal backdrops.
|
||||
*
|
||||
* @module core/modal_backdrop
|
||||
* @copyright 2016 Ryan Wyllie <ryan@moodle.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
define("core/modal_backdrop",["jquery","core/templates","core/notification","core/fullscreen"],(function($,Templates,Notification,Fullscreen){var SELECTORS_ROOT='[data-region="modal-backdrop"]',ModalBackdrop=function(root){this.root=$(root),this.isAttached=!1,this.attachmentPoint=document.createElement("div"),document.body.append(this.attachmentPoint),this.root.is(SELECTORS_ROOT)||Notification.exception({message:"Element is not a modal backdrop"})};return ModalBackdrop.prototype.getRoot=function(){return this.root},ModalBackdrop.prototype.getAttachmentPoint=function(){return $(Fullscreen.getElement()||this.attachmentPoint)},ModalBackdrop.prototype.attachToDOM=function(){this.getAttachmentPoint().append(this.root),this.isAttached||(this.isAttached=!0)},ModalBackdrop.prototype.setZIndex=function(value){this.root.css("z-index",value)},ModalBackdrop.prototype.isVisible=function(){return this.root.hasClass("show")},ModalBackdrop.prototype.hasTransitions=function(){return this.getRoot().hasClass("fade")},ModalBackdrop.prototype.show=function(){this.isVisible()||(this.attachToDOM(),this.root.removeClass("hide").addClass("show"))},ModalBackdrop.prototype.hide=function(){this.isVisible()&&(this.hasTransitions()?this.getRoot().one("transitionend webkitTransitionEnd oTransitionEnd",function(){this.getRoot().removeClass("show").addClass("hide")}.bind(this)):this.getRoot().removeClass("show").addClass("hide"),$(document.body).find(this.getRoot()).length&&$(document.body).append(this.getRoot()))},ModalBackdrop.prototype.destroy=function(){this.root.remove(),this.attachmentPoint.remove()},ModalBackdrop}));
|
||||
define("core/modal_backdrop",["exports","jquery","./notification","./fullscreen"],(function(_exports,_jquery,Notification,Fullscreen){var obj;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 _defineProperty(obj,key,value){return key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_jquery=(obj=_jquery)&&obj.__esModule?obj:{default:obj},Notification=_interopRequireWildcard(Notification),Fullscreen=_interopRequireWildcard(Fullscreen);const SELECTORS_ROOT='[data-region="modal-backdrop"]';return _exports.default=class{constructor(root){_defineProperty(this,"root",null),_defineProperty(this,"isAttached",!1),_defineProperty(this,"attachmentPoint",null),this.root=(0,_jquery.default)(root),this.isAttached=!1,this.attachmentPoint=document.createElement("div"),document.body.append(this.attachmentPoint),this.root.is(SELECTORS_ROOT)||Notification.exception({message:"Element is not a modal backdrop"})}getRoot(){return this.root}getAttachmentPoint(){return(0,_jquery.default)(Fullscreen.getElement()||this.attachmentPoint)}attachToDOM(){this.getAttachmentPoint().append(this.root),this.isAttached||(this.isAttached=!0)}setZIndex(value){this.root.css("z-index",value)}isVisible(){return this.root.hasClass("show")}hasTransitions(){return this.getRoot().hasClass("fade")}show(){this.isVisible()||(this.attachToDOM(),this.root.removeClass("hide").addClass("show"))}hide(){this.isVisible()&&(this.hasTransitions()?this.getRoot().one("transitionend webkitTransitionEnd oTransitionEnd",(()=>{this.getRoot().removeClass("show").addClass("hide")})):this.getRoot().removeClass("show").addClass("hide"),(0,_jquery.default)(document.body).find(this.getRoot()).length&&(0,_jquery.default)(document.body).append(this.getRoot()))}destroy(){this.root.remove(),this.attachmentPoint.remove()}},_exports.default}));
|
||||
|
||||
//# sourceMappingURL=modal_backdrop.min.js.map
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -20,20 +20,26 @@
|
|||
* @copyright 2016 Ryan Wyllie <ryan@moodle.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
||||
function($, Templates, Notification, Fullscreen) {
|
||||
import $ from 'jquery';
|
||||
import * as Notification from './notification';
|
||||
import * as Fullscreen from './fullscreen';
|
||||
|
||||
var SELECTORS = {
|
||||
ROOT: '[data-region="modal-backdrop"]',
|
||||
};
|
||||
const SELECTORS = {
|
||||
ROOT: '[data-region="modal-backdrop"]',
|
||||
};
|
||||
|
||||
export default class ModalBackdrop {
|
||||
root = null;
|
||||
isAttached = false;
|
||||
attachmentPoint = null;
|
||||
|
||||
/**
|
||||
* Constructor for ModalBackdrop.
|
||||
*
|
||||
* @class core/modal_backdrop
|
||||
* @param {object} root The root element for the modal backdrop
|
||||
* @param {HTMLElement|jQuery} root The root element for the modal backdrop
|
||||
*/
|
||||
var ModalBackdrop = function(root) {
|
||||
constructor(root) {
|
||||
this.root = $(root);
|
||||
this.isAttached = false;
|
||||
this.attachmentPoint = document.createElement('div');
|
||||
|
|
@ -42,7 +48,7 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
if (!this.root.is(SELECTORS.ROOT)) {
|
||||
Notification.exception({message: 'Element is not a modal backdrop'});
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the root element of this modal backdrop.
|
||||
|
|
@ -50,25 +56,25 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
* @method getRoot
|
||||
* @return {object} jQuery object
|
||||
*/
|
||||
ModalBackdrop.prototype.getRoot = function() {
|
||||
getRoot() {
|
||||
return this.root;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the jQuery wrapped node that the Modal should be attached to.
|
||||
*
|
||||
* @returns {jQuery}
|
||||
*/
|
||||
ModalBackdrop.prototype.getAttachmentPoint = function() {
|
||||
return $(Fullscreen.getElement() || this.attachmentPoint);
|
||||
};
|
||||
/**
|
||||
* Gets the jQuery wrapped node that the Modal should be attached to.
|
||||
*
|
||||
* @returns {jQuery}
|
||||
*/
|
||||
getAttachmentPoint() {
|
||||
return $(Fullscreen.getElement() || this.attachmentPoint);
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the modal backdrop to the page, if it hasn't already been added.
|
||||
*
|
||||
* @method attachToDOM
|
||||
*/
|
||||
ModalBackdrop.prototype.attachToDOM = function() {
|
||||
attachToDOM() {
|
||||
this.getAttachmentPoint().append(this.root);
|
||||
|
||||
if (this.isAttached) {
|
||||
|
|
@ -76,7 +82,7 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
}
|
||||
|
||||
this.isAttached = true;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the z-index value for this backdrop.
|
||||
|
|
@ -84,9 +90,9 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
* @method setZIndex
|
||||
* @param {int} value The z-index value
|
||||
*/
|
||||
ModalBackdrop.prototype.setZIndex = function(value) {
|
||||
setZIndex(value) {
|
||||
this.root.css('z-index', value);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if this backdrop is visible.
|
||||
|
|
@ -94,9 +100,9 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
* @method isVisible
|
||||
* @return {bool}
|
||||
*/
|
||||
ModalBackdrop.prototype.isVisible = function() {
|
||||
isVisible() {
|
||||
return this.root.hasClass('show');
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if this backdrop has CSS transitions applied.
|
||||
|
|
@ -104,9 +110,9 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
* @method hasTransitions
|
||||
* @return {bool}
|
||||
*/
|
||||
ModalBackdrop.prototype.hasTransitions = function() {
|
||||
hasTransitions() {
|
||||
return this.getRoot().hasClass('fade');
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Display this backdrop. The backdrop will be attached to the DOM if it hasn't
|
||||
|
|
@ -114,31 +120,30 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
*
|
||||
* @method show
|
||||
*/
|
||||
ModalBackdrop.prototype.show = function() {
|
||||
show() {
|
||||
if (this.isVisible()) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.attachToDOM();
|
||||
|
||||
this.root.removeClass('hide').addClass('show');
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Hide this backdrop.
|
||||
*
|
||||
* @method hide
|
||||
*/
|
||||
ModalBackdrop.prototype.hide = function() {
|
||||
hide() {
|
||||
if (!this.isVisible()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.hasTransitions()) {
|
||||
// Wait for CSS transitions to complete before hiding the element.
|
||||
this.getRoot().one('transitionend webkitTransitionEnd oTransitionEnd', function() {
|
||||
this.getRoot().one('transitionend webkitTransitionEnd oTransitionEnd', () => {
|
||||
this.getRoot().removeClass('show').addClass('hide');
|
||||
}.bind(this));
|
||||
});
|
||||
} else {
|
||||
this.getRoot().removeClass('show').addClass('hide');
|
||||
}
|
||||
|
|
@ -147,17 +152,15 @@ define(['jquery', 'core/templates', 'core/notification', 'core/fullscreen'],
|
|||
if ($(document.body).find(this.getRoot()).length) {
|
||||
$(document.body).append(this.getRoot());
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove this backdrop from the DOM.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
ModalBackdrop.prototype.destroy = function() {
|
||||
destroy() {
|
||||
this.root.remove();
|
||||
this.attachmentPoint.remove();
|
||||
};
|
||||
|
||||
return ModalBackdrop;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue