diff options
author | Mark Otto <markdotto@gmail.com> | 2016-10-10 03:26:51 +0300 |
---|---|---|
committer | Mark Otto <markdotto@gmail.com> | 2016-10-10 03:26:51 +0300 |
commit | 571e86e7705ee38a4b828b0e6f24de089a69e8a9 (patch) | |
tree | 6fa1e44c68d2e18720694a34803475e172f42b64 /js/dist/modal.js | |
parent | 6def7a5d56c5042a6f91361842f85f5af6e5b033 (diff) |
grunt
Diffstat (limited to 'js/dist/modal.js')
-rw-r--r-- | js/dist/modal.js | 592 |
1 files changed, 284 insertions, 308 deletions
diff --git a/js/dist/modal.js b/js/dist/modal.js index 96ad2a5677..790ce20348 100644 --- a/js/dist/modal.js +++ b/js/dist/modal.js @@ -1,8 +1,8 @@ -'use strict'; +var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; -var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })(); +var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } } +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } /** * -------------------------------------------------------------------------- @@ -11,7 +11,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons * -------------------------------------------------------------------------- */ -var Modal = (function ($) { +var Modal = function ($) { /** * ------------------------------------------------------------------------ @@ -78,7 +78,7 @@ var Modal = (function ($) { * ------------------------------------------------------------------------ */ - var Modal = (function () { + var Modal = function () { function Modal(element, config) { _classCallCheck(this, Modal); @@ -93,382 +93,352 @@ var Modal = (function ($) { this._scrollbarWidth = 0; } - /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ - */ - // getters - _createClass(Modal, [{ - key: 'toggle', + // public - // public + Modal.prototype.toggle = function toggle(relatedTarget) { + return this._isShown ? this.hide() : this.show(relatedTarget); + }; - value: function toggle(relatedTarget) { - return this._isShown ? this.hide() : this.show(relatedTarget); - } - }, { - key: 'show', - value: function show(relatedTarget) { - var _this = this; + Modal.prototype.show = function show(relatedTarget) { + var _this = this; - var showEvent = $.Event(Event.SHOW, { - relatedTarget: relatedTarget - }); + var showEvent = $.Event(Event.SHOW, { + relatedTarget: relatedTarget + }); - $(this._element).trigger(showEvent); + $(this._element).trigger(showEvent); - if (this._isShown || showEvent.isDefaultPrevented()) { - return; - } + if (this._isShown || showEvent.isDefaultPrevented()) { + return; + } - this._isShown = true; + this._isShown = true; - this._checkScrollbar(); - this._setScrollbar(); + this._checkScrollbar(); + this._setScrollbar(); - $(document.body).addClass(ClassName.OPEN); + $(document.body).addClass(ClassName.OPEN); - this._setEscapeEvent(); - this._setResizeEvent(); + this._setEscapeEvent(); + this._setResizeEvent(); - $(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, $.proxy(this.hide, this)); + $(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, $.proxy(this.hide, this)); - $(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () { - $(_this._element).one(Event.MOUSEUP_DISMISS, function (event) { - if ($(event.target).is(_this._element)) { - _this._ignoreBackdropClick = true; - } - }); + $(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () { + $(_this._element).one(Event.MOUSEUP_DISMISS, function (event) { + if ($(event.target).is(_this._element)) { + _this._ignoreBackdropClick = true; + } }); + }); + + this._showBackdrop($.proxy(this._showElement, this, relatedTarget)); + }; - this._showBackdrop($.proxy(this._showElement, this, relatedTarget)); + Modal.prototype.hide = function hide(event) { + if (event) { + event.preventDefault(); } - }, { - key: 'hide', - value: function hide(event) { - if (event) { - event.preventDefault(); - } - var hideEvent = $.Event(Event.HIDE); + var hideEvent = $.Event(Event.HIDE); - $(this._element).trigger(hideEvent); + $(this._element).trigger(hideEvent); - if (!this._isShown || hideEvent.isDefaultPrevented()) { - return; - } + if (!this._isShown || hideEvent.isDefaultPrevented()) { + return; + } - this._isShown = false; + this._isShown = false; - this._setEscapeEvent(); - this._setResizeEvent(); + this._setEscapeEvent(); + this._setResizeEvent(); - $(document).off(Event.FOCUSIN); + $(document).off(Event.FOCUSIN); - $(this._element).removeClass(ClassName.IN); + $(this._element).removeClass(ClassName.IN); - $(this._element).off(Event.CLICK_DISMISS); - $(this._dialog).off(Event.MOUSEDOWN_DISMISS); + $(this._element).off(Event.CLICK_DISMISS); + $(this._dialog).off(Event.MOUSEDOWN_DISMISS); - if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) { + if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) { - $(this._element).one(Util.TRANSITION_END, $.proxy(this._hideModal, this)).emulateTransitionEnd(TRANSITION_DURATION); - } else { - this._hideModal(); - } - } - }, { - key: 'dispose', - value: function dispose() { - $.removeData(this._element, DATA_KEY); - - $(window).off(EVENT_KEY); - $(document).off(EVENT_KEY); - $(this._element).off(EVENT_KEY); - $(this._backdrop).off(EVENT_KEY); - - this._config = null; - this._element = null; - this._dialog = null; - this._backdrop = null; - this._isShown = null; - this._isBodyOverflowing = null; - this._ignoreBackdropClick = null; - this._originalBodyPadding = null; - this._scrollbarWidth = null; + $(this._element).one(Util.TRANSITION_END, $.proxy(this._hideModal, this)).emulateTransitionEnd(TRANSITION_DURATION); + } else { + this._hideModal(); } + }; - // private + Modal.prototype.dispose = function dispose() { + $.removeData(this._element, DATA_KEY); - }, { - key: '_getConfig', - value: function _getConfig(config) { - config = $.extend({}, Default, config); - Util.typeCheckConfig(NAME, config, DefaultType); - return config; + $(window).off(EVENT_KEY); + $(document).off(EVENT_KEY); + $(this._element).off(EVENT_KEY); + $(this._backdrop).off(EVENT_KEY); + + this._config = null; + this._element = null; + this._dialog = null; + this._backdrop = null; + this._isShown = null; + this._isBodyOverflowing = null; + this._ignoreBackdropClick = null; + this._originalBodyPadding = null; + this._scrollbarWidth = null; + }; + + // private + + Modal.prototype._getConfig = function _getConfig(config) { + config = $.extend({}, Default, config); + Util.typeCheckConfig(NAME, config, DefaultType); + return config; + }; + + Modal.prototype._showElement = function _showElement(relatedTarget) { + var _this2 = this; + + var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE); + + if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) { + // don't move modals dom position + document.body.appendChild(this._element); } - }, { - key: '_showElement', - value: function _showElement(relatedTarget) { - var _this2 = this; - var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE); + this._element.style.display = 'block'; + this._element.removeAttribute('aria-hidden'); + this._element.scrollTop = 0; - if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) { - // don't move modals dom position - document.body.appendChild(this._element); - } + if (transition) { + Util.reflow(this._element); + } - this._element.style.display = 'block'; - this._element.removeAttribute('aria-hidden'); - this._element.scrollTop = 0; + $(this._element).addClass(ClassName.IN); - if (transition) { - Util.reflow(this._element); - } + if (this._config.focus) { + this._enforceFocus(); + } - $(this._element).addClass(ClassName.IN); + var shownEvent = $.Event(Event.SHOWN, { + relatedTarget: relatedTarget + }); - if (this._config.focus) { - this._enforceFocus(); + var transitionComplete = function transitionComplete() { + if (_this2._config.focus) { + _this2._element.focus(); } + $(_this2._element).trigger(shownEvent); + }; - var shownEvent = $.Event(Event.SHOWN, { - relatedTarget: relatedTarget - }); + if (transition) { + $(this._dialog).one(Util.TRANSITION_END, transitionComplete).emulateTransitionEnd(TRANSITION_DURATION); + } else { + transitionComplete(); + } + }; - var transitionComplete = function transitionComplete() { - if (_this2._config.focus) { - _this2._element.focus(); - } - $(_this2._element).trigger(shownEvent); - }; + Modal.prototype._enforceFocus = function _enforceFocus() { + var _this3 = this; - if (transition) { - $(this._dialog).one(Util.TRANSITION_END, transitionComplete).emulateTransitionEnd(TRANSITION_DURATION); - } else { - transitionComplete(); + $(document).off(Event.FOCUSIN) // guard against infinite focus loop + .on(Event.FOCUSIN, function (event) { + if (document !== event.target && _this3._element !== event.target && !$(_this3._element).has(event.target).length) { + _this3._element.focus(); } - } - }, { - key: '_enforceFocus', - value: function _enforceFocus() { - var _this3 = this; - - $(document).off(Event.FOCUSIN) // guard against infinite focus loop - .on(Event.FOCUSIN, function (event) { - if (document !== event.target && _this3._element !== event.target && !$(_this3._element).has(event.target).length) { - _this3._element.focus(); + }); + }; + + Modal.prototype._setEscapeEvent = function _setEscapeEvent() { + var _this4 = this; + + if (this._isShown && this._config.keyboard) { + $(this._element).on(Event.KEYDOWN_DISMISS, function (event) { + if (event.which === ESCAPE_KEYCODE) { + _this4.hide(); } }); + } else if (!this._isShown) { + $(this._element).off(Event.KEYDOWN_DISMISS); } - }, { - key: '_setEscapeEvent', - value: function _setEscapeEvent() { - var _this4 = this; - - if (this._isShown && this._config.keyboard) { - $(this._element).on(Event.KEYDOWN_DISMISS, function (event) { - if (event.which === ESCAPE_KEYCODE) { - _this4.hide(); - } - }); - } else if (!this._isShown) { - $(this._element).off(Event.KEYDOWN_DISMISS); - } - } - }, { - key: '_setResizeEvent', - value: function _setResizeEvent() { - if (this._isShown) { - $(window).on(Event.RESIZE, $.proxy(this._handleUpdate, this)); - } else { - $(window).off(Event.RESIZE); - } - } - }, { - key: '_hideModal', - value: function _hideModal() { - var _this5 = this; - - this._element.style.display = 'none'; - this._element.setAttribute('aria-hidden', 'true'); - this._showBackdrop(function () { - $(document.body).removeClass(ClassName.OPEN); - _this5._resetAdjustments(); - _this5._resetScrollbar(); - $(_this5._element).trigger(Event.HIDDEN); - }); + }; + + Modal.prototype._setResizeEvent = function _setResizeEvent() { + if (this._isShown) { + $(window).on(Event.RESIZE, $.proxy(this._handleUpdate, this)); + } else { + $(window).off(Event.RESIZE); } - }, { - key: '_removeBackdrop', - value: function _removeBackdrop() { - if (this._backdrop) { - $(this._backdrop).remove(); - this._backdrop = null; - } + }; + + Modal.prototype._hideModal = function _hideModal() { + var _this5 = this; + + this._element.style.display = 'none'; + this._element.setAttribute('aria-hidden', 'true'); + this._showBackdrop(function () { + $(document.body).removeClass(ClassName.OPEN); + _this5._resetAdjustments(); + _this5._resetScrollbar(); + $(_this5._element).trigger(Event.HIDDEN); + }); + }; + + Modal.prototype._removeBackdrop = function _removeBackdrop() { + if (this._backdrop) { + $(this._backdrop).remove(); + this._backdrop = null; } - }, { - key: '_showBackdrop', - value: function _showBackdrop(callback) { - var _this6 = this; + }; - var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : ''; + Modal.prototype._showBackdrop = function _showBackdrop(callback) { + var _this6 = this; - if (this._isShown && this._config.backdrop) { - var doAnimate = Util.supportsTransitionEnd() && animate; + var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : ''; - this._backdrop = document.createElement('div'); - this._backdrop.className = ClassName.BACKDROP; + if (this._isShown && this._config.backdrop) { + var doAnimate = Util.supportsTransitionEnd() && animate; - if (animate) { - $(this._backdrop).addClass(animate); - } + this._backdrop = document.createElement('div'); + this._backdrop.className = ClassName.BACKDROP; - $(this._backdrop).appendTo(document.body); - - $(this._element).on(Event.CLICK_DISMISS, function (event) { - if (_this6._ignoreBackdropClick) { - _this6._ignoreBackdropClick = false; - return; - } - if (event.target !== event.currentTarget) { - return; - } - if (_this6._config.backdrop === 'static') { - _this6._element.focus(); - } else { - _this6.hide(); - } - }); - - if (doAnimate) { - Util.reflow(this._backdrop); - } + if (animate) { + $(this._backdrop).addClass(animate); + } - $(this._backdrop).addClass(ClassName.IN); + $(this._backdrop).appendTo(document.body); - if (!callback) { + $(this._element).on(Event.CLICK_DISMISS, function (event) { + if (_this6._ignoreBackdropClick) { + _this6._ignoreBackdropClick = false; return; } - - if (!doAnimate) { - callback(); + if (event.target !== event.currentTarget) { return; } - - $(this._backdrop).one(Util.TRANSITION_END, callback).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION); - } else if (!this._isShown && this._backdrop) { - $(this._backdrop).removeClass(ClassName.IN); - - var callbackRemove = function callbackRemove() { - _this6._removeBackdrop(); - if (callback) { - callback(); - } - }; - - if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) { - $(this._backdrop).one(Util.TRANSITION_END, callbackRemove).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION); + if (_this6._config.backdrop === 'static') { + _this6._element.focus(); } else { - callbackRemove(); + _this6.hide(); } - } else if (callback) { - callback(); - } - } + }); - // ---------------------------------------------------------------------- - // the following methods are used to handle overflowing modals - // todo (fat): these should probably be refactored out of modal.js - // ---------------------------------------------------------------------- + if (doAnimate) { + Util.reflow(this._backdrop); + } - }, { - key: '_handleUpdate', - value: function _handleUpdate() { - this._adjustDialog(); - } - }, { - key: '_adjustDialog', - value: function _adjustDialog() { - var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight; + $(this._backdrop).addClass(ClassName.IN); - if (!this._isBodyOverflowing && isModalOverflowing) { - this._element.style.paddingLeft = this._scrollbarWidth + 'px'; + if (!callback) { + return; } - if (this._isBodyOverflowing && !isModalOverflowing) { - this._element.style.paddingRight = this._scrollbarWidth + 'px'; + if (!doAnimate) { + callback(); + return; } - } - }, { - key: '_resetAdjustments', - value: function _resetAdjustments() { - this._element.style.paddingLeft = ''; - this._element.style.paddingRight = ''; - } - }, { - key: '_checkScrollbar', - value: function _checkScrollbar() { - this._isBodyOverflowing = document.body.clientWidth < window.innerWidth; - this._scrollbarWidth = this._getScrollbarWidth(); - } - }, { - key: '_setScrollbar', - value: function _setScrollbar() { - var bodyPadding = parseInt($(Selector.FIXED_CONTENT).css('padding-right') || 0, 10); - this._originalBodyPadding = document.body.style.paddingRight || ''; + $(this._backdrop).one(Util.TRANSITION_END, callback).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION); + } else if (!this._isShown && this._backdrop) { + $(this._backdrop).removeClass(ClassName.IN); - if (this._isBodyOverflowing) { - document.body.style.paddingRight = bodyPadding + this._scrollbarWidth + 'px'; + var callbackRemove = function callbackRemove() { + _this6._removeBackdrop(); + if (callback) { + callback(); + } + }; + + if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) { + $(this._backdrop).one(Util.TRANSITION_END, callbackRemove).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION); + } else { + callbackRemove(); } + } else if (callback) { + callback(); } - }, { - key: '_resetScrollbar', - value: function _resetScrollbar() { - document.body.style.paddingRight = this._originalBodyPadding; + }; + + // ---------------------------------------------------------------------- + // the following methods are used to handle overflowing modals + // todo (fat): these should probably be refactored out of modal.js + // ---------------------------------------------------------------------- + + Modal.prototype._handleUpdate = function _handleUpdate() { + this._adjustDialog(); + }; + + Modal.prototype._adjustDialog = function _adjustDialog() { + var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight; + + if (!this._isBodyOverflowing && isModalOverflowing) { + this._element.style.paddingLeft = this._scrollbarWidth + 'px'; } - }, { - key: '_getScrollbarWidth', - value: function _getScrollbarWidth() { - // thx d.walsh - var scrollDiv = document.createElement('div'); - scrollDiv.className = ClassName.SCROLLBAR_MEASURER; - document.body.appendChild(scrollDiv); - var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth; - document.body.removeChild(scrollDiv); - return scrollbarWidth; + + if (this._isBodyOverflowing && !isModalOverflowing) { + this._element.style.paddingRight = this._scrollbarWidth + 'px'; } + }; - // static + Modal.prototype._resetAdjustments = function _resetAdjustments() { + this._element.style.paddingLeft = ''; + this._element.style.paddingRight = ''; + }; - }], [{ - key: '_jQueryInterface', - value: function _jQueryInterface(config, relatedTarget) { - return this.each(function () { - var data = $(this).data(DATA_KEY); - var _config = $.extend({}, Modal.Default, $(this).data(), typeof config === 'object' && config); + Modal.prototype._checkScrollbar = function _checkScrollbar() { + this._isBodyOverflowing = document.body.clientWidth < window.innerWidth; + this._scrollbarWidth = this._getScrollbarWidth(); + }; - if (!data) { - data = new Modal(this, _config); - $(this).data(DATA_KEY, data); - } + Modal.prototype._setScrollbar = function _setScrollbar() { + var bodyPadding = parseInt($(Selector.FIXED_CONTENT).css('padding-right') || 0, 10); - if (typeof config === 'string') { - if (data[config] === undefined) { - throw new Error('No method named "' + config + '"'); - } - data[config](relatedTarget); - } else if (_config.show) { - data.show(relatedTarget); - } - }); + this._originalBodyPadding = document.body.style.paddingRight || ''; + + if (this._isBodyOverflowing) { + document.body.style.paddingRight = bodyPadding + this._scrollbarWidth + 'px'; } - }, { + }; + + Modal.prototype._resetScrollbar = function _resetScrollbar() { + document.body.style.paddingRight = this._originalBodyPadding; + }; + + Modal.prototype._getScrollbarWidth = function _getScrollbarWidth() { + // thx d.walsh + var scrollDiv = document.createElement('div'); + scrollDiv.className = ClassName.SCROLLBAR_MEASURER; + document.body.appendChild(scrollDiv); + var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth; + document.body.removeChild(scrollDiv); + return scrollbarWidth; + }; + + // static + + Modal._jQueryInterface = function _jQueryInterface(config, relatedTarget) { + return this.each(function () { + var data = $(this).data(DATA_KEY); + var _config = $.extend({}, Modal.Default, $(this).data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config); + + if (!data) { + data = new Modal(this, _config); + $(this).data(DATA_KEY, data); + } + + if (typeof config === 'string') { + if (data[config] === undefined) { + throw new Error('No method named "' + config + '"'); + } + data[config](relatedTarget); + } else if (_config.show) { + data.show(relatedTarget); + } + }); + }; + + _createClass(Modal, null, [{ key: 'VERSION', get: function get() { return VERSION; @@ -481,12 +451,18 @@ var Modal = (function ($) { }]); return Modal; - })(); + }(); + + /** + * ------------------------------------------------------------------------ + * Data Api implementation + * ------------------------------------------------------------------------ + */ $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) { var _this7 = this; - var target = undefined; + var target = void 0; var selector = Util.getSelectorFromElement(this); if (selector) { @@ -529,5 +505,5 @@ var Modal = (function ($) { }; return Modal; -})(jQuery); +}(jQuery); //# sourceMappingURL=modal.js.map |