1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-10 07:37:27 +02:00
This commit is contained in:
XhmikosR
2019-03-01 18:31:34 +02:00
committed by GitHub
parent d47d29aeaa
commit 19aee321a0
62 changed files with 6075 additions and 3581 deletions

358
js/dist/modal.js vendored
View File

@@ -4,13 +4,15 @@
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
(global = global || self, global.Modal = factory(global.jQuery, global.Util));
}(this, function ($, Util) { 'use strict';
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('./dom/data.js'), require('./dom/eventHandler.js'), require('./dom/manipulator.js'), require('./dom/selectorEngine.js')) :
typeof define === 'function' && define.amd ? define(['./dom/data.js', './dom/eventHandler.js', './dom/manipulator.js', './dom/selectorEngine.js'], factory) :
(global = global || self, global.Modal = factory(global.Data, global.EventHandler, global.Manipulator, global.SelectorEngine));
}(this, function (Data, EventHandler, Manipulator, SelectorEngine) { 'use strict';
$ = $ && $.hasOwnProperty('default') ? $['default'] : $;
Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
Data = Data && Data.hasOwnProperty('default') ? Data['default'] : Data;
EventHandler = EventHandler && EventHandler.hasOwnProperty('default') ? EventHandler['default'] : EventHandler;
Manipulator = Manipulator && Manipulator.hasOwnProperty('default') ? Manipulator['default'] : Manipulator;
SelectorEngine = SelectorEngine && SelectorEngine.hasOwnProperty('default') ? SelectorEngine['default'] : SelectorEngine;
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
@@ -62,6 +64,120 @@
return target;
}
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.3.1): util/index.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
var MILLISECONDS_MULTIPLIER = 1000;
var TRANSITION_END = 'transitionend';
var jQuery = window.jQuery; // Shoutout AngusCroll (https://goo.gl/pxwQGp)
var toType = function toType(obj) {
return {}.toString.call(obj).match(/\s([a-z]+)/i)[1].toLowerCase();
};
var getSelectorFromElement = function getSelectorFromElement(element) {
var selector = element.getAttribute('data-target');
if (!selector || selector === '#') {
var hrefAttr = element.getAttribute('href');
selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : '';
}
try {
return document.querySelector(selector) ? selector : null;
} catch (err) {
return null;
}
};
var getTransitionDurationFromElement = function getTransitionDurationFromElement(element) {
if (!element) {
return 0;
} // Get transition-duration of the element
var _window$getComputedSt = window.getComputedStyle(element),
transitionDuration = _window$getComputedSt.transitionDuration,
transitionDelay = _window$getComputedSt.transitionDelay;
var floatTransitionDuration = parseFloat(transitionDuration);
var floatTransitionDelay = parseFloat(transitionDelay); // Return 0 if element or transition duration is not found
if (!floatTransitionDuration && !floatTransitionDelay) {
return 0;
} // If multiple durations are defined, take the first
transitionDuration = transitionDuration.split(',')[0];
transitionDelay = transitionDelay.split(',')[0];
return (parseFloat(transitionDuration) + parseFloat(transitionDelay)) * MILLISECONDS_MULTIPLIER;
};
var triggerTransitionEnd = function triggerTransitionEnd(element) {
element.dispatchEvent(new Event(TRANSITION_END));
};
var isElement = function isElement(obj) {
return (obj[0] || obj).nodeType;
};
var emulateTransitionEnd = function emulateTransitionEnd(element, duration) {
var called = false;
var durationPadding = 5;
var emulatedDuration = duration + durationPadding;
function listener() {
called = true;
element.removeEventListener(TRANSITION_END, listener);
}
element.addEventListener(TRANSITION_END, listener);
setTimeout(function () {
if (!called) {
triggerTransitionEnd(element);
}
}, emulatedDuration);
};
var typeCheckConfig = function typeCheckConfig(componentName, config, configTypes) {
Object.keys(configTypes).forEach(function (property) {
var expectedTypes = configTypes[property];
var value = config[property];
var valueType = value && isElement(value) ? 'element' : toType(value);
if (!new RegExp(expectedTypes).test(valueType)) {
throw new Error(componentName.toUpperCase() + ": " + ("Option \"" + property + "\" provided type \"" + valueType + "\" ") + ("but expected type \"" + expectedTypes + "\"."));
}
});
};
var makeArray = function makeArray(nodeList) {
if (!nodeList) {
return [];
}
return [].slice.call(nodeList);
};
var isVisible = function isVisible(element) {
if (!element) {
return false;
}
if (element.style && element.parentNode && element.parentNode.style) {
return element.style.display !== 'none' && element.parentNode.style.display !== 'none' && element.style.visibility !== 'hidden';
}
return false;
};
var reflow = function reflow(element) {
return element.offsetHeight;
};
/**
* ------------------------------------------------------------------------
* Constants
@@ -73,7 +189,6 @@
var DATA_KEY = 'bs.modal';
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
var Default = {
@@ -88,7 +203,7 @@
focus: 'boolean',
show: 'boolean'
};
var Event = {
var Event$1 = {
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
@@ -130,13 +245,14 @@
function Modal(element, config) {
this._config = this._getConfig(config);
this._element = element;
this._dialog = element.querySelector(Selector.DIALOG);
this._dialog = SelectorEngine.findOne(Selector.DIALOG, element);
this._backdrop = null;
this._isShown = false;
this._isBodyOverflowing = false;
this._ignoreBackdropClick = false;
this._isTransitioning = false;
this._scrollbarWidth = 0;
Data.setData(element, DATA_KEY, this);
} // Getters
@@ -154,16 +270,15 @@
return;
}
if ($(this._element).hasClass(ClassName.FADE)) {
if (this._element.classList.contains(ClassName.FADE)) {
this._isTransitioning = true;
}
var showEvent = $.Event(Event.SHOW, {
var showEvent = EventHandler.trigger(this._element, Event$1.SHOW, {
relatedTarget: relatedTarget
});
$(this._element).trigger(showEvent);
if (this._isShown || showEvent.isDefaultPrevented()) {
if (this._isShown || showEvent.defaultPrevented) {
return;
}
@@ -179,12 +294,12 @@
this._setResizeEvent();
$(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
EventHandler.on(this._element, Event$1.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
return _this.hide(event);
});
$(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () {
$(_this._element).one(Event.MOUSEUP_DISMISS, function (event) {
if ($(event.target).is(_this._element)) {
EventHandler.on(this._dialog, Event$1.MOUSEDOWN_DISMISS, function () {
EventHandler.one(_this._element, Event$1.MOUSEUP_DISMISS, function (event) {
if (event.target === _this._element) {
_this._ignoreBackdropClick = true;
}
});
@@ -206,15 +321,15 @@
return;
}
var hideEvent = $.Event(Event.HIDE);
$(this._element).trigger(hideEvent);
var hideEvent = EventHandler.trigger(this._element, Event$1.HIDE);
if (!this._isShown || hideEvent.isDefaultPrevented()) {
if (!this._isShown || hideEvent.defaultPrevented) {
return;
}
this._isShown = false;
var transition = $(this._element).hasClass(ClassName.FADE);
var transition = this._element.classList.contains(ClassName.FADE);
if (transition) {
this._isTransitioning = true;
@@ -224,16 +339,19 @@
this._setResizeEvent();
$(document).off(Event.FOCUSIN);
$(this._element).removeClass(ClassName.SHOW);
$(this._element).off(Event.CLICK_DISMISS);
$(this._dialog).off(Event.MOUSEDOWN_DISMISS);
EventHandler.off(document, Event$1.FOCUSIN);
this._element.classList.remove(ClassName.SHOW);
EventHandler.off(this._element, Event$1.CLICK_DISMISS);
EventHandler.off(this._dialog, Event$1.MOUSEDOWN_DISMISS);
if (transition) {
var transitionDuration = Util.getTransitionDurationFromElement(this._element);
$(this._element).one(Util.TRANSITION_END, function (event) {
var transitionDuration = getTransitionDurationFromElement(this._element);
EventHandler.one(this._element, TRANSITION_END, function (event) {
return _this2._hideModal(event);
}).emulateTransitionEnd(transitionDuration);
});
emulateTransitionEnd(this._element, transitionDuration);
} else {
this._hideModal();
}
@@ -241,7 +359,7 @@
_proto.dispose = function dispose() {
[window, this._element, this._dialog].forEach(function (htmlElement) {
return $(htmlElement).off(EVENT_KEY);
return EventHandler.off(htmlElement, EVENT_KEY);
});
/**
* `document` has 2 events `Event.FOCUSIN` and `Event.CLICK_DATA_API`
@@ -249,8 +367,8 @@
* It will remove `Event.CLICK_DATA_API` event that should remain
*/
$(document).off(Event.FOCUSIN);
$.removeData(this._element, DATA_KEY);
EventHandler.off(document, Event$1.FOCUSIN);
Data.removeData(this._element, DATA_KEY);
this._config = null;
this._element = null;
this._dialog = null;
@@ -269,14 +387,14 @@
_proto._getConfig = function _getConfig(config) {
config = _objectSpread({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
typeCheckConfig(NAME, config, DefaultType);
return config;
};
_proto._showElement = function _showElement(relatedTarget) {
var _this3 = this;
var transition = $(this._element).hasClass(ClassName.FADE);
var transition = this._element.classList.contains(ClassName.FADE);
if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
// Don't move modal's DOM position
@@ -289,38 +407,37 @@
this._element.setAttribute('aria-modal', true);
if ($(this._dialog).hasClass(ClassName.SCROLLABLE)) {
this._dialog.querySelector(Selector.MODAL_BODY).scrollTop = 0;
if (this._dialog.classList.contains(ClassName.SCROLLABLE)) {
SelectorEngine.findOne(Selector.MODAL_BODY, this._dialog).scrollTop = 0;
} else {
this._element.scrollTop = 0;
}
if (transition) {
Util.reflow(this._element);
reflow(this._element);
}
$(this._element).addClass(ClassName.SHOW);
this._element.classList.add(ClassName.SHOW);
if (this._config.focus) {
this._enforceFocus();
}
var shownEvent = $.Event(Event.SHOWN, {
relatedTarget: relatedTarget
});
var transitionComplete = function transitionComplete() {
if (_this3._config.focus) {
_this3._element.focus();
}
_this3._isTransitioning = false;
$(_this3._element).trigger(shownEvent);
EventHandler.trigger(_this3._element, Event$1.SHOWN, {
relatedTarget: relatedTarget
});
};
if (transition) {
var transitionDuration = Util.getTransitionDurationFromElement(this._dialog);
$(this._dialog).one(Util.TRANSITION_END, transitionComplete).emulateTransitionEnd(transitionDuration);
var transitionDuration = getTransitionDurationFromElement(this._dialog);
EventHandler.one(this._dialog, TRANSITION_END, transitionComplete);
emulateTransitionEnd(this._dialog, transitionDuration);
} else {
transitionComplete();
}
@@ -329,9 +446,10 @@
_proto._enforceFocus = function _enforceFocus() {
var _this4 = this;
$(document).off(Event.FOCUSIN) // Guard against infinite focus loop
.on(Event.FOCUSIN, function (event) {
if (document !== event.target && _this4._element !== event.target && $(_this4._element).has(event.target).length === 0) {
EventHandler.off(document, Event$1.FOCUSIN); // guard against infinite focus loop
EventHandler.on(document, Event$1.FOCUSIN, function (event) {
if (document !== event.target && _this4._element !== event.target && !_this4._element.contains(event.target)) {
_this4._element.focus();
}
});
@@ -341,7 +459,7 @@
var _this5 = this;
if (this._isShown && this._config.keyboard) {
$(this._element).on(Event.KEYDOWN_DISMISS, function (event) {
EventHandler.on(this._element, Event$1.KEYDOWN_DISMISS, function (event) {
if (event.which === ESCAPE_KEYCODE) {
event.preventDefault();
@@ -349,7 +467,7 @@
}
});
} else if (!this._isShown) {
$(this._element).off(Event.KEYDOWN_DISMISS);
EventHandler.off(this._element, Event$1.KEYDOWN_DISMISS);
}
};
@@ -357,11 +475,11 @@
var _this6 = this;
if (this._isShown) {
$(window).on(Event.RESIZE, function (event) {
EventHandler.on(window, Event$1.RESIZE, function (event) {
return _this6.handleUpdate(event);
});
} else {
$(window).off(Event.RESIZE);
EventHandler.off(window, Event$1.RESIZE);
}
};
@@ -377,19 +495,20 @@
this._isTransitioning = false;
this._showBackdrop(function () {
$(document.body).removeClass(ClassName.OPEN);
document.body.classList.remove(ClassName.OPEN);
_this7._resetAdjustments();
_this7._resetScrollbar();
$(_this7._element).trigger(Event.HIDDEN);
EventHandler.trigger(_this7._element, Event$1.HIDDEN);
});
};
_proto._removeBackdrop = function _removeBackdrop() {
if (this._backdrop) {
$(this._backdrop).remove();
this._backdrop.parentNode.removeChild(this._backdrop);
this._backdrop = null;
}
};
@@ -397,7 +516,7 @@
_proto._showBackdrop = function _showBackdrop(callback) {
var _this8 = this;
var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : '';
var animate = this._element.classList.contains(ClassName.FADE) ? ClassName.FADE : '';
if (this._isShown && this._config.backdrop) {
this._backdrop = document.createElement('div');
@@ -407,8 +526,8 @@
this._backdrop.classList.add(animate);
}
$(this._backdrop).appendTo(document.body);
$(this._element).on(Event.CLICK_DISMISS, function (event) {
document.body.appendChild(this._backdrop);
EventHandler.on(this._element, Event$1.CLICK_DISMISS, function (event) {
if (_this8._ignoreBackdropClick) {
_this8._ignoreBackdropClick = false;
return;
@@ -426,10 +545,10 @@
});
if (animate) {
Util.reflow(this._backdrop);
reflow(this._backdrop);
}
$(this._backdrop).addClass(ClassName.SHOW);
this._backdrop.classList.add(ClassName.SHOW);
if (!callback) {
return;
@@ -440,10 +559,11 @@
return;
}
var backdropTransitionDuration = Util.getTransitionDurationFromElement(this._backdrop);
$(this._backdrop).one(Util.TRANSITION_END, callback).emulateTransitionEnd(backdropTransitionDuration);
var backdropTransitionDuration = getTransitionDurationFromElement(this._backdrop);
EventHandler.one(this._backdrop, TRANSITION_END, callback);
emulateTransitionEnd(this._backdrop, backdropTransitionDuration);
} else if (!this._isShown && this._backdrop) {
$(this._backdrop).removeClass(ClassName.SHOW);
this._backdrop.classList.remove(ClassName.SHOW);
var callbackRemove = function callbackRemove() {
_this8._removeBackdrop();
@@ -453,10 +573,11 @@
}
};
if ($(this._element).hasClass(ClassName.FADE)) {
var _backdropTransitionDuration = Util.getTransitionDurationFromElement(this._backdrop);
if (this._element.classList.contains(ClassName.FADE)) {
var _backdropTransitionDuration = getTransitionDurationFromElement(this._backdrop);
$(this._backdrop).one(Util.TRANSITION_END, callbackRemove).emulateTransitionEnd(_backdropTransitionDuration);
EventHandler.one(this._backdrop, TRANSITION_END, callbackRemove);
emulateTransitionEnd(this._backdrop, _backdropTransitionDuration);
} else {
callbackRemove();
}
@@ -498,50 +619,58 @@
if (this._isBodyOverflowing) {
// Note: DOMNode.style.paddingRight returns the actual value or '' if not set
// while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
var fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT));
var stickyContent = [].slice.call(document.querySelectorAll(Selector.STICKY_CONTENT)); // Adjust fixed content padding
$(fixedContent).each(function (index, element) {
// Adjust fixed content padding
makeArray(SelectorEngine.find(Selector.FIXED_CONTENT)).forEach(function (element) {
var actualPadding = element.style.paddingRight;
var calculatedPadding = $(element).css('padding-right');
$(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + "px");
var calculatedPadding = window.getComputedStyle(element)['padding-right'];
Manipulator.setDataAttribute(element, 'padding-right', actualPadding);
element.style.paddingRight = parseFloat(calculatedPadding) + _this9._scrollbarWidth + "px";
}); // Adjust sticky content margin
$(stickyContent).each(function (index, element) {
makeArray(SelectorEngine.find(Selector.STICKY_CONTENT)).forEach(function (element) {
var actualMargin = element.style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + "px");
var calculatedMargin = window.getComputedStyle(element)['margin-right'];
Manipulator.setDataAttribute(element, 'margin-right', actualMargin);
element.style.marginRight = parseFloat(calculatedMargin) - _this9._scrollbarWidth + "px";
}); // Adjust body padding
var actualPadding = document.body.style.paddingRight;
var calculatedPadding = $(document.body).css('padding-right');
$(document.body).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + "px");
var calculatedPadding = window.getComputedStyle(document.body)['padding-right'];
Manipulator.setDataAttribute(document.body, 'padding-right', actualPadding);
document.body.style.paddingRight = parseFloat(calculatedPadding) + this._scrollbarWidth + "px";
}
$(document.body).addClass(ClassName.OPEN);
document.body.classList.add(ClassName.OPEN);
};
_proto._resetScrollbar = function _resetScrollbar() {
// Restore fixed content padding
var fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT));
$(fixedContent).each(function (index, element) {
var padding = $(element).data('padding-right');
$(element).removeData('padding-right');
element.style.paddingRight = padding ? padding : '';
}); // Restore sticky content
makeArray(SelectorEngine.find(Selector.FIXED_CONTENT)).forEach(function (element) {
var padding = Manipulator.getDataAttribute(element, 'padding-right');
var elements = [].slice.call(document.querySelectorAll("" + Selector.STICKY_CONTENT));
$(elements).each(function (index, element) {
var margin = $(element).data('margin-right');
if (typeof padding !== 'undefined') {
Manipulator.removeDataAttribute(element, 'padding-right');
element.style.paddingRight = padding;
}
}); // Restore sticky content and navbar-toggler margin
makeArray(SelectorEngine.find("" + Selector.STICKY_CONTENT)).forEach(function (element) {
var margin = Manipulator.getDataAttribute(element, 'margin-right');
if (typeof margin !== 'undefined') {
$(element).css('margin-right', margin).removeData('margin-right');
Manipulator.removeDataAttribute(element, 'margin-right');
element.style.marginRight = margin;
}
}); // Restore body padding
var padding = $(document.body).data('padding-right');
$(document.body).removeData('padding-right');
document.body.style.paddingRight = padding ? padding : '';
var padding = Manipulator.getDataAttribute(document.body, 'padding-right');
if (typeof padding !== 'undefined') {
Manipulator.removeDataAttribute(document.body, 'padding-right');
document.body.style.paddingRight = padding;
} else {
document.body.style.paddingRight = '';
}
};
_proto._getScrollbarWidth = function _getScrollbarWidth() {
@@ -557,13 +686,12 @@
Modal._jQueryInterface = function _jQueryInterface(config, relatedTarget) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var data = Data.getData(this, DATA_KEY);
var _config = _objectSpread({}, Default, $(this).data(), typeof config === 'object' && config ? config : {});
var _config = _objectSpread({}, Default, Manipulator.getDataAttributes(this), typeof config === 'object' && config ? config : {});
if (!data) {
data = new Modal(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'string') {
@@ -578,6 +706,10 @@
});
};
Modal._getInstance = function _getInstance(element) {
return Data.getData(element, DATA_KEY);
};
_createClass(Modal, null, [{
key: "VERSION",
get: function get() {
@@ -599,36 +731,41 @@
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
EventHandler.on(document, Event$1.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
var _this10 = this;
var target;
var selector = Util.getSelectorFromElement(this);
var selector = getSelectorFromElement(this);
if (selector) {
target = document.querySelector(selector);
target = SelectorEngine.findOne(selector);
}
var config = $(target).data(DATA_KEY) ? 'toggle' : _objectSpread({}, $(target).data(), $(this).data());
var config = Data.getData(target, DATA_KEY) ? 'toggle' : _objectSpread({}, Manipulator.getDataAttributes(target), Manipulator.getDataAttributes(this));
if (this.tagName === 'A' || this.tagName === 'AREA') {
event.preventDefault();
}
var $target = $(target).one(Event.SHOW, function (showEvent) {
if (showEvent.isDefaultPrevented()) {
// Only register focus restorer if modal will actually get shown
EventHandler.one(target, Event$1.SHOW, function (showEvent) {
if (showEvent.defaultPrevented) {
// only register focus restorer if modal will actually get shown
return;
}
$target.one(Event.HIDDEN, function () {
if ($(_this10).is(':visible')) {
EventHandler.one(target, Event$1.HIDDEN, function () {
if (isVisible(_this10)) {
_this10.focus();
}
});
});
var data = Data.getData(target, DATA_KEY);
Modal._jQueryInterface.call($(target), config, this);
if (!data) {
data = new Modal(target, config);
}
data.show(this);
});
/**
* ------------------------------------------------------------------------
@@ -636,13 +773,16 @@
* ------------------------------------------------------------------------
*/
$.fn[NAME] = Modal._jQueryInterface;
$.fn[NAME].Constructor = Modal;
if (typeof jQuery !== 'undefined') {
var JQUERY_NO_CONFLICT = jQuery.fn[NAME];
jQuery.fn[NAME] = Modal._jQueryInterface;
jQuery.fn[NAME].Constructor = Modal;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Modal._jQueryInterface;
};
jQuery.fn[NAME].noConflict = function () {
jQuery.fn[NAME] = JQUERY_NO_CONFLICT;
return Modal._jQueryInterface;
};
}
return Modal;