diff options
Diffstat (limited to 'library/bootstrap/js/bootstrap.js')
| -rw-r--r-- | library/bootstrap/js/bootstrap.js | 518 |
1 files changed, 342 insertions, 176 deletions
diff --git a/library/bootstrap/js/bootstrap.js b/library/bootstrap/js/bootstrap.js index 865256739..4048449a0 100644 --- a/library/bootstrap/js/bootstrap.js +++ b/library/bootstrap/js/bootstrap.js @@ -438,6 +438,9 @@ var Button = function ($) { } if (triggerChangeEvent) { + if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) { + return; + } input.checked = !$(this._element).hasClass(ClassName.ACTIVE); $(input).trigger('change'); } @@ -1086,9 +1089,8 @@ var Collapse = function ($) { }; var Selector = { - ACTIVES: '.card > .show, .card > .collapsing', - DATA_TOGGLE: '[data-toggle="collapse"]', - DATA_CHILDREN: 'data-children' + ACTIVES: '.show, .collapsing', + DATA_TOGGLE: '[data-toggle="collapse"]' }; /** @@ -1105,20 +1107,13 @@ var Collapse = function ($) { this._element = element; this._config = this._getConfig(config); this._triggerArray = $.makeArray($('[data-toggle="collapse"][href="#' + element.id + '"],' + ('[data-toggle="collapse"][data-target="#' + element.id + '"]'))); + this._parent = this._config.parent ? this._getParent() : null; if (!this._config.parent) { this._addAriaAndCollapsedClass(this._element, this._triggerArray); } - this._selectorActives = Selector.ACTIVES; - if (this._parent) { - var childrenSelector = this._parent.hasAttribute(Selector.DATA_CHILDREN) ? this._parent.getAttribute(Selector.DATA_CHILDREN) : null; - if (childrenSelector !== null) { - this._selectorActives = childrenSelector + ' > .show, ' + childrenSelector + ' > .collapsing'; - } - } - if (this._config.toggle) { this.toggle(); } @@ -1147,7 +1142,7 @@ var Collapse = function ($) { var activesData = void 0; if (this._parent) { - actives = $.makeArray($(this._parent).find(this._selectorActives)); + actives = $.makeArray($(this._parent).children().children(Selector.ACTIVES)); if (!actives.length) { actives = null; } @@ -1381,6 +1376,8 @@ var Collapse = function ($) { return Collapse; }(jQuery); +/* global Popper */ + /** * -------------------------------------------------------------------------- * Bootstrap (v4.0.0-alpha.6): dropdown.js @@ -1391,6 +1388,14 @@ var Collapse = function ($) { var Dropdown = function ($) { /** + * Check for Popper dependency + * Popper - https://popper.js.org + */ + if (typeof Popper === 'undefined') { + throw new Error('Bootstrap dropdown require Popper.js (https://popper.js.org)'); + } + + /** * ------------------------------------------------------------------------ * Constants * ------------------------------------------------------------------------ @@ -1423,7 +1428,10 @@ var Dropdown = function ($) { var ClassName = { DISABLED: 'disabled', - SHOW: 'show' + SHOW: 'show', + DROPUP: 'dropup', + MENURIGHT: 'dropdown-menu-right', + MENULEFT: 'dropdown-menu-left' }; var Selector = { @@ -1434,6 +1442,25 @@ var Dropdown = function ($) { VISIBLE_ITEMS: '.dropdown-menu .dropdown-item:not(.disabled)' }; + var AttachmentMap = { + TOP: 'top-start', + TOPEND: 'top-end', + BOTTOM: 'bottom-start', + BOTTOMEND: 'bottom-end' + }; + + var Default = { + placement: AttachmentMap.BOTTOM, + offset: 0, + flip: true + }; + + var DefaultType = { + placement: 'string', + offset: '(number|string)', + flip: 'boolean' + }; + /** * ------------------------------------------------------------------------ * Class Definition @@ -1441,10 +1468,13 @@ var Dropdown = function ($) { */ var Dropdown = function () { - function Dropdown(element) { + function Dropdown(element, config) { _classCallCheck(this, Dropdown); this._element = element; + this._popper = null; + this._config = this._getConfig(config); + this._menu = this._getMenuElement(); this._addEventListeners(); } @@ -1454,30 +1484,49 @@ var Dropdown = function ($) { // public Dropdown.prototype.toggle = function toggle() { - if (this.disabled || $(this).hasClass(ClassName.DISABLED)) { - return false; + if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) { + return; } - var parent = Dropdown._getParentFromElement(this); - var isActive = $(parent).hasClass(ClassName.SHOW); + var parent = Dropdown._getParentFromElement(this._element); + var isActive = $(this._menu).hasClass(ClassName.SHOW); Dropdown._clearMenus(); if (isActive) { - return false; + return; } var relatedTarget = { - relatedTarget: this + relatedTarget: this._element }; var showEvent = $.Event(Event.SHOW, relatedTarget); $(parent).trigger(showEvent); if (showEvent.isDefaultPrevented()) { - return false; + return; } + var element = this._element; + // for dropup with alignment we use the parent as popper container + if ($(parent).hasClass(ClassName.DROPUP)) { + if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) { + element = parent; + } + } + this._popper = new Popper(element, this._menu, { + placement: this._getPlacement(), + modifiers: { + offset: { + offset: this._config.offset + }, + flip: { + enabled: this._config.flip + } + } + }); + // if this is a touch-enabled device we add extra // empty mouseover listeners to the body's immediate children; // only needed because of broken event delegation on iOS @@ -1486,25 +1535,79 @@ var Dropdown = function ($) { $('body').children().on('mouseover', null, $.noop); } - this.focus(); - this.setAttribute('aria-expanded', true); + this._element.focus(); + this._element.setAttribute('aria-expanded', true); - $(parent).toggleClass(ClassName.SHOW); - $(parent).trigger($.Event(Event.SHOWN, relatedTarget)); - - return false; + $(this._menu).toggleClass(ClassName.SHOW); + $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget)); }; Dropdown.prototype.dispose = function dispose() { $.removeData(this._element, DATA_KEY); $(this._element).off(EVENT_KEY); this._element = null; + this._menu = null; + if (this._popper !== null) { + this._popper.destroy(); + } + this._popper = null; + }; + + Dropdown.prototype.update = function update() { + if (this._popper !== null) { + this._popper.scheduleUpdate(); + } }; // private Dropdown.prototype._addEventListeners = function _addEventListeners() { - $(this._element).on(Event.CLICK, this.toggle); + var _this9 = this; + + $(this._element).on(Event.CLICK, function (event) { + event.preventDefault(); + event.stopPropagation(); + _this9.toggle(); + }); + }; + + Dropdown.prototype._getConfig = function _getConfig(config) { + var elementData = $(this._element).data(); + if (elementData.placement !== undefined) { + elementData.placement = AttachmentMap[elementData.placement.toUpperCase()]; + } + + config = $.extend({}, this.constructor.Default, $(this._element).data(), config); + + Util.typeCheckConfig(NAME, config, this.constructor.DefaultType); + + return config; + }; + + Dropdown.prototype._getMenuElement = function _getMenuElement() { + if (!this._menu) { + var parent = Dropdown._getParentFromElement(this._element); + this._menu = $(parent).find(Selector.MENU)[0]; + } + return this._menu; + }; + + Dropdown.prototype._getPlacement = function _getPlacement() { + var $parentDropdown = $(this._element).parent(); + var placement = this._config.placement; + + // Handle dropup + if ($parentDropdown.hasClass(ClassName.DROPUP) || this._config.placement === AttachmentMap.TOP) { + placement = AttachmentMap.TOP; + if ($(this._menu).hasClass(ClassName.MENURIGHT)) { + placement = AttachmentMap.TOPEND; + } + } else { + if ($(this._menu).hasClass(ClassName.MENURIGHT)) { + placement = AttachmentMap.BOTTOMEND; + } + } + return placement; }; // static @@ -1512,9 +1615,10 @@ var Dropdown = function ($) { Dropdown._jQueryInterface = function _jQueryInterface(config) { return this.each(function () { var data = $(this).data(DATA_KEY); + var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null; if (!data) { - data = new Dropdown(this); + data = new Dropdown(this, _config); $(this).data(DATA_KEY, data); } @@ -1522,7 +1626,7 @@ var Dropdown = function ($) { if (data[config] === undefined) { throw new Error('No method named "' + config + '"'); } - data[config].call(this); + data[config](); } }); }; @@ -1533,13 +1637,18 @@ var Dropdown = function ($) { } var toggles = $.makeArray($(Selector.DATA_TOGGLE)); - for (var i = 0; i < toggles.length; i++) { var parent = Dropdown._getParentFromElement(toggles[i]); + var context = $(toggles[i]).data(DATA_KEY); var relatedTarget = { relatedTarget: toggles[i] }; + if (!context) { + continue; + } + + var dropdownMenu = context._menu; if (!$(parent).hasClass(ClassName.SHOW)) { continue; } @@ -1562,6 +1671,7 @@ var Dropdown = function ($) { toggles[i].setAttribute('aria-expanded', 'false'); + $(dropdownMenu).removeClass(ClassName.SHOW); $(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget)); } }; @@ -1633,6 +1743,16 @@ var Dropdown = function ($) { get: function get() { return VERSION; } + }, { + key: 'Default', + get: function get() { + return Default; + } + }, { + key: 'DefaultType', + get: function get() { + return DefaultType; + } }]); return Dropdown; @@ -1644,7 +1764,11 @@ var Dropdown = function ($) { * ------------------------------------------------------------------------ */ - $(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + ' ' + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, Dropdown.prototype.toggle).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) { + $(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + ' ' + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) { + event.preventDefault(); + event.stopPropagation(); + Dropdown._jQueryInterface.call($(this), 'toggle'); + }).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) { e.stopPropagation(); }); @@ -1763,7 +1887,7 @@ var Modal = function ($) { }; Modal.prototype.show = function show(relatedTarget) { - var _this9 = this; + var _this10 = this; if (this._isTransitioning) { return; @@ -1794,24 +1918,24 @@ var Modal = function ($) { this._setResizeEvent(); $(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) { - return _this9.hide(event); + return _this10.hide(event); }); $(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () { - $(_this9._element).one(Event.MOUSEUP_DISMISS, function (event) { - if ($(event.target).is(_this9._element)) { - _this9._ignoreBackdropClick = true; + $(_this10._element).one(Event.MOUSEUP_DISMISS, function (event) { + if ($(event.target).is(_this10._element)) { + _this10._ignoreBackdropClick = true; } }); }); this._showBackdrop(function () { - return _this9._showElement(relatedTarget); + return _this10._showElement(relatedTarget); }); }; Modal.prototype.hide = function hide(event) { - var _this10 = this; + var _this11 = this; if (event) { event.preventDefault(); @@ -1850,7 +1974,7 @@ var Modal = function ($) { if (transition) { $(this._element).one(Util.TRANSITION_END, function (event) { - return _this10._hideModal(event); + return _this11._hideModal(event); }).emulateTransitionEnd(TRANSITION_DURATION); } else { this._hideModal(); @@ -1885,7 +2009,7 @@ var Modal = function ($) { }; Modal.prototype._showElement = function _showElement(relatedTarget) { - var _this11 = this; + var _this12 = this; var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE); @@ -1913,11 +2037,11 @@ var Modal = function ($) { }); var transitionComplete = function transitionComplete() { - if (_this11._config.focus) { - _this11._element.focus(); + if (_this12._config.focus) { + _this12._element.focus(); } - _this11._isTransitioning = false; - $(_this11._element).trigger(shownEvent); + _this12._isTransitioning = false; + $(_this12._element).trigger(shownEvent); }; if (transition) { @@ -1928,24 +2052,24 @@ var Modal = function ($) { }; Modal.prototype._enforceFocus = function _enforceFocus() { - var _this12 = this; + var _this13 = this; $(document).off(Event.FOCUSIN) // guard against infinite focus loop .on(Event.FOCUSIN, function (event) { - if (document !== event.target && _this12._element !== event.target && !$(_this12._element).has(event.target).length) { - _this12._element.focus(); + if (document !== event.target && _this13._element !== event.target && !$(_this13._element).has(event.target).length) { + _this13._element.focus(); } }); }; Modal.prototype._setEscapeEvent = function _setEscapeEvent() { - var _this13 = this; + var _this14 = this; if (this._isShown && this._config.keyboard) { $(this._element).on(Event.KEYDOWN_DISMISS, function (event) { if (event.which === ESCAPE_KEYCODE) { event.preventDefault(); - _this13.hide(); + _this14.hide(); } }); } else if (!this._isShown) { @@ -1954,11 +2078,11 @@ var Modal = function ($) { }; Modal.prototype._setResizeEvent = function _setResizeEvent() { - var _this14 = this; + var _this15 = this; if (this._isShown) { $(window).on(Event.RESIZE, function (event) { - return _this14.handleUpdate(event); + return _this15.handleUpdate(event); }); } else { $(window).off(Event.RESIZE); @@ -1966,16 +2090,16 @@ var Modal = function ($) { }; Modal.prototype._hideModal = function _hideModal() { - var _this15 = this; + var _this16 = this; this._element.style.display = 'none'; this._element.setAttribute('aria-hidden', true); this._isTransitioning = false; this._showBackdrop(function () { $(document.body).removeClass(ClassName.OPEN); - _this15._resetAdjustments(); - _this15._resetScrollbar(); - $(_this15._element).trigger(Event.HIDDEN); + _this16._resetAdjustments(); + _this16._resetScrollbar(); + $(_this16._element).trigger(Event.HIDDEN); }); }; @@ -1987,7 +2111,7 @@ var Modal = function ($) { }; Modal.prototype._showBackdrop = function _showBackdrop(callback) { - var _this16 = this; + var _this17 = this; var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : ''; @@ -2004,17 +2128,17 @@ var Modal = function ($) { $(this._backdrop).appendTo(document.body); $(this._element).on(Event.CLICK_DISMISS, function (event) { - if (_this16._ignoreBackdropClick) { - _this16._ignoreBackdropClick = false; + if (_this17._ignoreBackdropClick) { + _this17._ignoreBackdropClick = false; return; } if (event.target !== event.currentTarget) { return; } - if (_this16._config.backdrop === 'static') { - _this16._element.focus(); + if (_this17._config.backdrop === 'static') { + _this17._element.focus(); } else { - _this16.hide(); + _this17.hide(); } }); @@ -2038,7 +2162,7 @@ var Modal = function ($) { $(this._backdrop).removeClass(ClassName.SHOW); var callbackRemove = function callbackRemove() { - _this16._removeBackdrop(); + _this17._removeBackdrop(); if (callback) { callback(); } @@ -2082,7 +2206,7 @@ var Modal = function ($) { }; Modal.prototype._setScrollbar = function _setScrollbar() { - var _this17 = this; + var _this18 = this; if (this._isBodyOverflowing) { // Note: DOMNode.style.paddingRight returns the actual value or '' if not set @@ -2092,14 +2216,14 @@ var Modal = function ($) { $(Selector.FIXED_CONTENT).each(function (index, element) { var actualPadding = $(element)[0].style.paddingRight; var calculatedPadding = $(element).css('padding-right'); - $(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this17._scrollbarWidth + 'px'); + $(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this18._scrollbarWidth + 'px'); }); // Adjust navbar-toggler margin $(Selector.NAVBAR_TOGGLER).each(function (index, element) { var actualMargin = $(element)[0].style.marginRight; var calculatedMargin = $(element).css('margin-right'); - $(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this17._scrollbarWidth + 'px'); + $(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this18._scrollbarWidth + 'px'); }); // Adjust body padding @@ -2188,7 +2312,7 @@ var Modal = function ($) { */ $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) { - var _this18 = this; + var _this19 = this; var target = void 0; var selector = Util.getSelectorFromElement(this); @@ -2210,8 +2334,8 @@ var Modal = function ($) { } $target.one(Event.HIDDEN, function () { - if ($(_this18).is(':visible')) { - _this18.focus(); + if ($(_this19).is(':visible')) { + _this19.focus(); } }); }); @@ -2305,7 +2429,7 @@ var ScrollSpy = function ($) { var ScrollSpy = function () { function ScrollSpy(element, config) { - var _this19 = this; + var _this20 = this; _classCallCheck(this, ScrollSpy); @@ -2319,7 +2443,7 @@ var ScrollSpy = function ($) { this._scrollHeight = 0; $(this._scrollElement).on(Event.SCROLL, function (event) { - return _this19._process(event); + return _this20._process(event); }); this.refresh(); @@ -2331,7 +2455,7 @@ var ScrollSpy = function ($) { // public ScrollSpy.prototype.refresh = function refresh() { - var _this20 = this; + var _this21 = this; var autoMethod = this._scrollElement !== this._scrollElement.window ? OffsetMethod.POSITION : OffsetMethod.OFFSET; @@ -2367,8 +2491,8 @@ var ScrollSpy = function ($) { }).sort(function (a, b) { return a[0] - b[0]; }).forEach(function (item) { - _this20._offsets.push(item[0]); - _this20._targets.push(item[1]); + _this21._offsets.push(item[0]); + _this21._targets.push(item[1]); }); }; @@ -2615,7 +2739,7 @@ var Tab = function ($) { // public Tab.prototype.show = function show() { - var _this21 = this; + var _this22 = this; if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) { return; @@ -2657,7 +2781,7 @@ var Tab = function ($) { var complete = function complete() { var hiddenEvent = $.Event(Event.HIDDEN, { - relatedTarget: _this21._element + relatedTarget: _this22._element }); var shownEvent = $.Event(Event.SHOWN, { @@ -2665,7 +2789,7 @@ var Tab = function ($) { }); $(previous).trigger(hiddenEvent); - $(_this21._element).trigger(shownEvent); + $(_this22._element).trigger(shownEvent); }; if (target) { @@ -2676,20 +2800,20 @@ var Tab = function ($) { }; Tab.prototype.dispose = function dispose() { - $.removeClass(this._element, DATA_KEY); + $.removeData(this._element, DATA_KEY); this._element = null; }; // private Tab.prototype._activate = function _activate(element, container, callback) { - var _this22 = this; + var _this23 = this; var active = $(container).find(Selector.ACTIVE)[0]; var isTransitioning = callback && Util.supportsTransitionEnd() && active && $(active).hasClass(ClassName.FADE); var complete = function complete() { - return _this22._transitionComplete(element, active, isTransitioning, callback); + return _this23._transitionComplete(element, active, isTransitioning, callback); }; if (active && isTransitioning) { @@ -2799,7 +2923,7 @@ var Tab = function ($) { return Tab; }(jQuery); -/* global Tether */ +/* global Popper */ /** * -------------------------------------------------------------------------- @@ -2811,11 +2935,11 @@ var Tab = function ($) { var Tooltip = function ($) { /** - * Check for Tether dependency - * Tether - http://tether.io/ + * Check for Popper dependency + * Popper - https://popper.js.org */ - if (typeof Tether === 'undefined') { - throw new Error('Bootstrap tooltips require Tether (http://tether.io/)'); + if (typeof Popper === 'undefined') { + throw new Error('Bootstrap tooltips require Popper.js (https://popper.js.org)'); } /** @@ -2830,22 +2954,8 @@ var Tooltip = function ($) { var EVENT_KEY = '.' + DATA_KEY; var JQUERY_NO_CONFLICT = $.fn[NAME]; var TRANSITION_DURATION = 150; - var CLASS_PREFIX = 'bs-tether'; - var TETHER_PREFIX_REGEX = new RegExp('(^|\\s)' + CLASS_PREFIX + '\\S+', 'g'); - - var Default = { - animation: true, - template: '<div class="tooltip" role="tooltip">' + '<div class="tooltip-inner"></div></div>', - trigger: 'hover focus', - title: '', - delay: 0, - html: false, - selector: false, - placement: 'top', - offset: '0 0', - constraints: [], - container: false - }; + var CLASS_PREFIX = 'bs-tooltip'; + var BSCLS_PREFIX_REGEX = new RegExp('(^|\\s)' + CLASS_PREFIX + '\\S+', 'g'); var DefaultType = { animation: 'boolean', @@ -2856,16 +2966,31 @@ var Tooltip = function ($) { html: 'boolean', selector: '(string|boolean)', placement: '(string|function)', - offset: 'string', - constraints: 'array', - container: '(string|element|boolean)' + offset: '(number|string)', + container: '(string|element|boolean)', + fallbackPlacement: '(string|array)' }; var AttachmentMap = { - TOP: 'bottom center', - RIGHT: 'middle left', - BOTTOM: 'top center', - LEFT: 'middle right' + AUTO: 'auto', + TOP: 'top', + RIGHT: 'right', + BOTTOM: 'bottom', + LEFT: 'left' + }; + + var Default = { + animation: true, + template: '<div class="tooltip" role="tooltip">' + '<div class="arrow"></div>' + '<div class="tooltip-inner"></div></div>', + trigger: 'hover focus', + title: '', + delay: 0, + html: false, + selector: false, + placement: 'top', + offset: 0, + container: false, + fallbackPlacement: 'flip' }; var HoverState = { @@ -2893,12 +3018,8 @@ var Tooltip = function ($) { var Selector = { TOOLTIP: '.tooltip', - TOOLTIP_INNER: '.tooltip-inner' - }; - - var TetherClass = { - element: false, - enabled: false + TOOLTIP_INNER: '.tooltip-inner', + ARROW: '.arrow' }; var Trigger = { @@ -2923,7 +3044,7 @@ var Tooltip = function ($) { this._timeout = 0; this._hoverState = ''; this._activeTrigger = {}; - this._tether = null; + this._popper = null; // protected this.element = element; @@ -2980,8 +3101,6 @@ var Tooltip = function ($) { Tooltip.prototype.dispose = function dispose() { clearTimeout(this._timeout); - this.cleanupTether(); - $.removeData(this.element, this.constructor.DATA_KEY); $(this.element).off(this.constructor.EVENT_KEY); @@ -2995,7 +3114,10 @@ var Tooltip = function ($) { this._timeout = null; this._hoverState = null; this._activeTrigger = null; - this._tether = null; + if (this._popper !== null) { + this._popper.destroy(); + } + this._popper = null; this.element = null; this.config = null; @@ -3003,7 +3125,7 @@ var Tooltip = function ($) { }; Tooltip.prototype.show = function show() { - var _this23 = this; + var _this24 = this; if ($(this.element).css('display') === 'none') { throw new Error('Please use show on visible elements'); @@ -3034,6 +3156,7 @@ var Tooltip = function ($) { var placement = typeof this.config.placement === 'function' ? this.config.placement.call(this, tip, this.element) : this.config.placement; var attachment = this._getAttachment(placement); + this.addAttachmentClass(attachment); var container = this.config.container === false ? document.body : $(this.config.container); @@ -3045,20 +3168,29 @@ var Tooltip = function ($) { $(this.element).trigger(this.constructor.Event.INSERTED); - this._tether = new Tether({ - attachment: attachment, - element: tip, - target: this.element, - classes: TetherClass, - classPrefix: CLASS_PREFIX, - offset: this.config.offset, - constraints: this.config.constraints, - addTargetClasses: false + this._popper = new Popper(this.element, tip, { + placement: attachment, + modifiers: { + offset: { + offset: this.config.offset + }, + flip: { + behavior: this.config.fallbackPlacement + }, + arrow: { + element: Selector.ARROW + } + }, + onCreate: function onCreate(data) { + if (data.originalPlacement !== data.placement) { + _this24._handlePopperPlacementChange(data); + } + }, + onUpdate: function onUpdate(data) { + _this24._handlePopperPlacementChange(data); + } }); - Util.reflow(tip); - this._tether.position(); - $(tip).addClass(ClassName.SHOW); // if this is a touch-enabled device we add extra @@ -3070,39 +3202,43 @@ var Tooltip = function ($) { } var complete = function complete() { - var prevHoverState = _this23._hoverState; - _this23._hoverState = null; + if (_this24.config.animation) { + _this24._fixTransition(); + } + var prevHoverState = _this24._hoverState; + _this24._hoverState = null; - $(_this23.element).trigger(_this23.constructor.Event.SHOWN); + $(_this24.element).trigger(_this24.constructor.Event.SHOWN); if (prevHoverState === HoverState.OUT) { - _this23._leave(null, _this23); + _this24._leave(null, _this24); } }; if (Util.supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE)) { $(this.tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(Tooltip._TRANSITION_DURATION); - return; + } else { + complete(); } - - complete(); } }; Tooltip.prototype.hide = function hide(callback) { - var _this24 = this; + var _this25 = this; var tip = this.getTipElement(); var hideEvent = $.Event(this.constructor.Event.HIDE); var complete = function complete() { - if (_this24._hoverState !== HoverState.SHOW && tip.parentNode) { + if (_this25._hoverState !== HoverState.SHOW && tip.parentNode) { tip.parentNode.removeChild(tip); } - _this24._cleanTipClass(); - _this24.element.removeAttribute('aria-describedby'); - $(_this24.element).trigger(_this24.constructor.Event.HIDDEN); - _this24.cleanupTether(); + _this25._cleanTipClass(); + _this25.element.removeAttribute('aria-describedby'); + $(_this25.element).trigger(_this25.constructor.Event.HIDDEN); + if (_this25._popper !== null) { + _this25._popper.destroy(); + } if (callback) { callback(); @@ -3137,24 +3273,30 @@ var Tooltip = function ($) { this._hoverState = ''; }; + Tooltip.prototype.update = function update() { + if (this._popper !== null) { + this._popper.scheduleUpdate(); + } + }; + // protected Tooltip.prototype.isWithContent = function isWithContent() { return Boolean(this.getTitle()); }; + Tooltip.prototype.addAttachmentClass = function addAttachmentClass(attachment) { + $(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment); + }; + Tooltip.prototype.getTipElement = function getTipElement() { return this.tip = this.tip || $(this.config.template)[0]; }; Tooltip.prototype.setContent = function setContent() { var $tip = $(this.getTipElement()); - this.setElementContent($tip.find(Selector.TOOLTIP_INNER), this.getTitle()); - $tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW); - - this.cleanupTether(); }; Tooltip.prototype.setElementContent = function setElementContent($element, content) { @@ -3183,49 +3325,35 @@ var Tooltip = function ($) { return title; }; - Tooltip.prototype.cleanupTether = function cleanupTether() { - if (this._tether) { - this._tether.destroy(); - } - }; - // private Tooltip.prototype._getAttachment = function _getAttachment(placement) { return AttachmentMap[placement.toUpperCase()]; }; - Tooltip.prototype._cleanTipClass = function _cleanTipClass() { - var $tip = $(this.getTipElement()); - var tabClass = $tip.attr('class').match(TETHER_PREFIX_REGEX); - if (tabClass !== null && tabClass.length > 0) { - $tip.removeClass(tabClass.join('')); - } - }; - Tooltip.prototype._setListeners = function _setListeners() { - var _this25 = this; + var _this26 = this; var triggers = this.config.trigger.split(' '); triggers.forEach(function (trigger) { if (trigger === 'click') { - $(_this25.element).on(_this25.constructor.Event.CLICK, _this25.config.selector, function (event) { - return _this25.toggle(event); + $(_this26.element).on(_this26.constructor.Event.CLICK, _this26.config.selector, function (event) { + return _this26.toggle(event); }); } else if (trigger !== Trigger.MANUAL) { - var eventIn = trigger === Trigger.HOVER ? _this25.constructor.Event.MOUSEENTER : _this25.constructor.Event.FOCUSIN; - var eventOut = trigger === Trigger.HOVER ? _this25.constructor.Event.MOUSELEAVE : _this25.constructor.Event.FOCUSOUT; + var eventIn = trigger === Trigger.HOVER ? _this26.constructor.Event.MOUSEENTER : _this26.constructor.Event.FOCUSIN; + var eventOut = trigger === Trigger.HOVER ? _this26.constructor.Event.MOUSELEAVE : _this26.constructor.Event.FOCUSOUT; - $(_this25.element).on(eventIn, _this25.config.selector, function (event) { - return _this25._enter(event); - }).on(eventOut, _this25.config.selector, function (event) { - return _this25._leave(event); + $(_this26.element).on(eventIn, _this26.config.selector, function (event) { + return _this26._enter(event); + }).on(eventOut, _this26.config.selector, function (event) { + return _this26._leave(event); }); } - $(_this25.element).closest('.modal').on('hide.bs.modal', function () { - return _this25.hide(); + $(_this26.element).closest('.modal').on('hide.bs.modal', function () { + return _this26.hide(); }); }); @@ -3363,6 +3491,32 @@ var Tooltip = function ($) { return config; }; + Tooltip.prototype._cleanTipClass = function _cleanTipClass() { + var $tip = $(this.getTipElement()); + var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX); + if (tabClass !== null && tabClass.length > 0) { + $tip.removeClass(tabClass.join('')); + } + }; + + Tooltip.prototype._handlePopperPlacementChange = function _handlePopperPlacementChange(data) { + this._cleanTipClass(); + this.addAttachmentClass(this._getAttachment(data.placement)); + }; + + Tooltip.prototype._fixTransition = function _fixTransition() { + var tip = this.getTipElement(); + var initConfigAnimation = this.config.animation; + if (tip.getAttribute('x-placement') !== null) { + return; + } + $(tip).removeClass(ClassName.FADE); + this.config.animation = false; + this.hide(); + this.show(); + this.config.animation = initConfigAnimation; + }; + // static Tooltip._jQueryInterface = function _jQueryInterface(config) { @@ -3464,12 +3618,14 @@ var Popover = function ($) { var DATA_KEY = 'bs.popover'; var EVENT_KEY = '.' + DATA_KEY; var JQUERY_NO_CONFLICT = $.fn[NAME]; + var CLASS_PREFIX = 'bs-popover'; + var BSCLS_PREFIX_REGEX = new RegExp('(^|\\s)' + CLASS_PREFIX + '\\S+', 'g'); var Default = $.extend({}, Tooltip.Default, { placement: 'right', trigger: 'click', content: '', - template: '<div class="popover" role="tooltip">' + '<h3 class="popover-title"></h3>' + '<div class="popover-content"></div></div>' + template: '<div class="popover" role="tooltip">' + '<div class="arrow"></div>' + '<h3 class="popover-title"></h3>' + '<div class="popover-content"></div></div>' }); var DefaultType = $.extend({}, Tooltip.DefaultType, { @@ -3520,6 +3676,10 @@ var Popover = function ($) { return this.getTitle() || this._getContent(); }; + Popover.prototype.addAttachmentClass = function addAttachmentClass(attachment) { + $(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment); + }; + Popover.prototype.getTipElement = function getTipElement() { return this.tip = this.tip || $(this.config.template)[0]; }; @@ -3532,8 +3692,6 @@ var Popover = function ($) { this.setElementContent($tip.find(Selector.CONTENT), this._getContent()); $tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW); - - this.cleanupTether(); }; // private @@ -3542,6 +3700,14 @@ var Popover = function ($) { return this.element.getAttribute('data-content') || (typeof this.config.content === 'function' ? this.config.content.call(this.element) : this.config.content); }; + Popover.prototype._cleanTipClass = function _cleanTipClass() { + var $tip = $(this.getTipElement()); + var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX); + if (tabClass !== null && tabClass.length > 0) { + $tip.removeClass(tabClass.join('')); + } + }; + // static Popover._jQueryInterface = function _jQueryInterface(config) { |