aboutsummaryrefslogtreecommitdiff
path: root/js/dist/tooltip.js
diff options
context:
space:
mode:
authorfat <[email protected]>2015-05-11 23:32:37 -0700
committerfat <[email protected]>2015-05-11 23:32:37 -0700
commit3452e8dc8336c7a4151bcccdb9d3d4202f06f294 (patch)
tree7314ef1451ba4e373471ac493e6903365f489d1a /js/dist/tooltip.js
parent8eee78ca15f51dc7e7d514497078bfd7c012ac21 (diff)
downloadbootstrap-3452e8dc8336c7a4151bcccdb9d3d4202f06f294.tar.xz
bootstrap-3452e8dc8336c7a4151bcccdb9d3d4202f06f294.zip
rewritten tooltip + tether integration and death to our positioner jank
Diffstat (limited to 'js/dist/tooltip.js')
-rw-r--r--js/dist/tooltip.js597
1 files changed, 597 insertions, 0 deletions
diff --git a/js/dist/tooltip.js b/js/dist/tooltip.js
new file mode 100644
index 000000000..0ff622018
--- /dev/null
+++ b/js/dist/tooltip.js
@@ -0,0 +1,597 @@
+'use strict';
+
+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'); } }
+
+/**
+ * --------------------------------------------------------------------------
+ * Bootstrap (v4.0.0): alert.js
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ * --------------------------------------------------------------------------
+ */
+
+var ToolTip = (function ($) {
+
+ /**
+ * ------------------------------------------------------------------------
+ * Constants
+ * ------------------------------------------------------------------------
+ */
+
+ var NAME = 'tooltip';
+ var VERSION = '4.0.0';
+ var DATA_KEY = 'bs.tooltip';
+ var JQUERY_NO_CONFLICT = $.fn[NAME];
+ var TRANSITION_DURATION = 150;
+ var CLASS_PREFIX = 'bs-tether';
+
+ var Default = {
+ animation: true,
+ template: '<div class="tooltip" role="tooltip">' + '<div class="tooltip-arrow"></div>' + '<div class="tooltip-inner"></div></div>',
+ trigger: 'hover focus',
+ title: '',
+ delay: 0,
+ html: false,
+ selector: false,
+ attachment: 'top',
+ offset: '0 0',
+ constraints: null
+ };
+
+ var HorizontalMirror = {
+ LEFT: 'right',
+ CENTER: 'center',
+ RIGHT: 'left'
+ };
+
+ var VerticalMirror = {
+ TOP: 'bottom',
+ MIDDLE: 'middle',
+ BOTTOM: 'top'
+ };
+
+ var VerticalDefault = {
+ LEFT: 'middle',
+ CENTER: 'bottom',
+ RIGHT: 'middle'
+ };
+
+ var HorizontalDefault = {
+ TOP: 'center',
+ MIDDLE: 'left',
+ BOTTOM: 'center'
+ };
+
+ var HoverState = {
+ IN: 'in',
+ OUT: 'out'
+ };
+
+ var Event = {
+ HIDE: 'hide.bs.tooltip',
+ HIDDEN: 'hidden.bs.tooltip',
+ SHOW: 'show.bs.tooltip',
+ SHOWN: 'shown.bs.tooltip',
+ INSERTED: 'inserted.bs.tooltip',
+ CLICK: 'click.bs.tooltip',
+ FOCUSIN: 'focusin.bs.tooltip',
+ FOCUSOUT: 'focusout.bs.tooltip',
+ MOUSEENTER: 'mouseenter.bs.tooltip',
+ MOUSELEAVE: 'mouseleave.bs.tooltip'
+ };
+
+ var ClassName = {
+ FADE: 'fade',
+ IN: 'in'
+ };
+
+ var Selector = {
+ TOOLTIP: '.tooltip',
+ TOOLTIP_INNER: '.tooltip-inner',
+ TOOLTIP_ARROW: '.tooltip-arrow'
+ };
+
+ var TetherClass = {
+ 'element': false,
+ 'enabled': false
+ };
+
+ /**
+ * ------------------------------------------------------------------------
+ * Class Definition
+ * ------------------------------------------------------------------------
+ */
+
+ var Tooltip = (function () {
+ function Tooltip(element, config) {
+ _classCallCheck(this, Tooltip);
+
+ // private
+ this._isEnabled = true;
+ this._timeout = 0;
+ this._hoverState = '';
+ this._activeTrigger = {};
+
+ // protected
+ this.element = element;
+ this.config = this._getConfig(config);
+ this.tip = null;
+ this.tether = null;
+
+ this._setListeners();
+ }
+
+ _createClass(Tooltip, [{
+ key: 'enable',
+
+ // public
+
+ value: function enable() {
+ this._isEnabled = true;
+ }
+ }, {
+ key: 'disable',
+ value: function disable() {
+ this._isEnabled = false;
+ }
+ }, {
+ key: 'toggleEnabled',
+ value: function toggleEnabled() {
+ this._isEnabled = !this._isEnabled;
+ }
+ }, {
+ key: 'toggle',
+ value: function toggle(event) {
+ var context = this;
+
+ if (event) {
+ context = $(event.currentTarget).data(DATA_KEY);
+
+ if (!context) {
+ context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+ $(event.currentTarget).data(DATA_KEY, context);
+ }
+
+ context._activeTrigger.click = !context._activeTrigger.click;
+
+ if (context._isWithActiveTrigger()) {
+ context._enter(null, context);
+ } else {
+ context._leave(null, context);
+ }
+ } else {
+ $(context.getTipElement()).hasClass(ClassName.IN) ? context._leave(null, context) : context._enter(null, context);
+ }
+ }
+ }, {
+ key: 'destroy',
+ value: function destroy() {
+ var _this = this;
+
+ clearTimeout(this._timeout);
+ this.hide(function () {
+ $(_this.element).off(Selector.TOOLTIP).removeData(DATA_KEY);
+ });
+ }
+ }, {
+ key: 'show',
+ value: function show() {
+ var _this2 = this;
+
+ var showEvent = $.Event(Event.SHOW);
+
+ if (this.isWithContent() && this._isEnabled) {
+ $(this.element).trigger(showEvent);
+
+ var isInTheDom = $.contains(this.element.ownerDocument.documentElement, this.element);
+
+ if (showEvent.isDefaultPrevented() || !isInTheDom) {
+ return;
+ }
+
+ var tip = this.getTipElement();
+ var tipId = Util.getUID(NAME);
+
+ tip.setAttribute('id', tipId);
+ this.element.setAttribute('aria-describedby', tipId);
+
+ this.setContent();
+
+ if (this.config.animation) {
+ $(tip).addClass(ClassName.FADE);
+ }
+
+ var attachment = typeof this.config.attachment === 'function' ? this.config.attachment.call(this, tip, this.element) : this.config.attachment;
+
+ attachment = this.getAttachment(attachment);
+
+ $(tip).data(DATA_KEY, this);
+
+ this.element.parentNode.insertBefore(tip, this.element.nextSibling);
+ $(this.element).trigger(Event.INSERTED);
+
+ this.tether = new Tether({
+ element: this.tip,
+ target: this.element,
+ attachment: attachment,
+ classes: TetherClass,
+ classPrefix: CLASS_PREFIX,
+ offset: this.config.offset,
+ constraints: this.config.constraints
+ });
+
+ Util.reflow(tip);
+ this.tether.position();
+
+ $(tip).addClass(ClassName.IN);
+
+ var complete = function complete() {
+ var prevHoverState = _this2._hoverState;
+ _this2._hoverState = null;
+
+ $(_this2.element).trigger(Event.SHOWN);
+
+ if (prevHoverState === HoverState.OUT) {
+ _this2._leave(null, _this2);
+ }
+ };
+
+ Util.supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE) ? $(this.tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(Tooltip._TRANSITION_DURATION) : complete();
+ }
+ }
+ }, {
+ key: 'hide',
+ value: function hide(callback) {
+ var _this3 = this;
+
+ var tip = this.getTipElement();
+ var hideEvent = $.Event(Event.HIDE);
+ var complete = function complete() {
+ if (_this3._hoverState !== HoverState.IN && tip.parentNode) {
+ tip.parentNode.removeChild(tip);
+ }
+
+ _this3.element.removeAttribute('aria-describedby');
+ $(_this3.element).trigger(Event.HIDDEN);
+ _this3.cleanupTether();
+
+ if (callback) {
+ callback();
+ }
+ };
+
+ $(this.element).trigger(hideEvent);
+
+ if (hideEvent.isDefaultPrevented()) {
+ return;
+ }
+
+ $(tip).removeClass(ClassName.IN);
+
+ if (Util.supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE)) {
+
+ $(tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
+ } else {
+ complete();
+ }
+
+ this._hoverState = '';
+ }
+ }, {
+ key: 'isWithContent',
+
+ // protected
+
+ value: function isWithContent() {
+ return !!this.getTitle();
+ }
+ }, {
+ key: 'getTipElement',
+ value: function getTipElement() {
+ return this.tip = this.tip || $(this.config.template)[0];
+ }
+ }, {
+ key: 'getAttachment',
+ value: function getAttachment(attachmentString) {
+ var attachmentArray = attachmentString.split(' ');
+ var normalizedAttachment = {};
+
+ if (!attachmentArray.length) {
+ throw new Error('Tooltip requires attachment');
+ }
+
+ var _iteratorNormalCompletion = true;
+ var _didIteratorError = false;
+ var _iteratorError = undefined;
+
+ try {
+ for (var _iterator = attachmentArray[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+ var attachment = _step.value;
+
+ attachment = attachment.toUpperCase();
+
+ if (HorizontalMirror[attachment]) {
+ normalizedAttachment.horizontal = HorizontalMirror[attachment];
+ }
+
+ if (VerticalMirror[attachment]) {
+ normalizedAttachment.vertical = VerticalMirror[attachment];
+ }
+ }
+ } catch (err) {
+ _didIteratorError = true;
+ _iteratorError = err;
+ } finally {
+ try {
+ if (!_iteratorNormalCompletion && _iterator['return']) {
+ _iterator['return']();
+ }
+ } finally {
+ if (_didIteratorError) {
+ throw _iteratorError;
+ }
+ }
+ }
+
+ if (!normalizedAttachment.horizontal && !normalizedAttachment.vertical) {
+ throw new Error('Tooltip requires valid attachment');
+ }
+
+ if (!normalizedAttachment.horizontal) {
+ normalizedAttachment.horizontal = HorizontalDefault[normalizedAttachment.vertical.toUpperCase()];
+ }
+
+ if (!normalizedAttachment.vertical) {
+ normalizedAttachment.vertical = VerticalDefault[normalizedAttachment.horizontal.toUpperCase()];
+ }
+
+ return [normalizedAttachment.vertical, normalizedAttachment.horizontal].join(' ');
+ }
+ }, {
+ key: 'setContent',
+ value: function setContent() {
+ var tip = this.getTipElement();
+ var title = this.getTitle();
+ var method = this.config.html ? 'innerHTML' : 'innerText';
+
+ $(tip).find(Selector.TOOLTIP_INNER)[0][method] = title;
+
+ $(tip).removeClass(ClassName.FADE).removeClass(ClassName.IN);
+
+ this.cleanupTether();
+ }
+ }, {
+ key: 'getTitle',
+ value: function getTitle() {
+ var title = this.element.getAttribute('data-original-title');
+
+ if (!title) {
+ title = typeof this.config.title === 'function' ? this.config.title.call(this.element) : this.config.title;
+ }
+
+ return title;
+ }
+ }, {
+ key: 'removeTetherClasses',
+ value: function removeTetherClasses(i, css) {
+ return ((css.baseVal || css).match(new RegExp('(^|\\s)' + CLASS_PREFIX + '-\\S+', 'g')) || []).join(' ');
+ }
+ }, {
+ key: 'cleanupTether',
+ value: function cleanupTether() {
+ if (this.tether) {
+ this.tether.destroy();
+
+ // clean up after tether's junk classes
+ // remove after they fix issue
+ // (https://github.com/HubSpot/tether/issues/36)
+ $(this.element).removeClass(this.removeTetherClasses);
+ $(this.tip).removeClass(this.removeTetherClasses);
+ }
+ }
+ }, {
+ key: '_setListeners',
+
+ // private
+
+ value: function _setListeners() {
+ var _this4 = this;
+
+ var triggers = this.config.trigger.split(' ');
+
+ triggers.forEach(function (trigger) {
+ if (trigger === 'click') {
+ $(_this4.element).on(Event.CLICK, _this4.config.selector, _this4.toggle.bind(_this4));
+ } else if (trigger !== 'manual') {
+ var eventIn = trigger == 'hover' ? Event.MOUSEENTER : Event.FOCUSIN;
+ var eventOut = trigger == 'hover' ? Event.MOUSELEAVE : Event.FOCUSOUT;
+
+ $(_this4.element).on(eventIn, _this4.config.selector, _this4._enter.bind(_this4)).on(eventOut, _this4.config.selector, _this4._leave.bind(_this4));
+ }
+ });
+
+ if (this.config.selector) {
+ this.config = $.extend({}, this.config, {
+ trigger: 'manual',
+ selector: ''
+ });
+ } else {
+ this._fixTitle();
+ }
+ }
+ }, {
+ key: '_fixTitle',
+ value: function _fixTitle() {
+ var titleType = typeof this.element.getAttribute('data-original-title');
+ if (this.element.getAttribute('title') || titleType !== 'string') {
+ this.element.setAttribute('data-original-title', this.element.getAttribute('title') || '');
+ this.element.setAttribute('title', '');
+ }
+ }
+ }, {
+ key: '_enter',
+ value: function _enter(event, context) {
+ context = context || $(event.currentTarget).data(DATA_KEY);
+
+ if (!context) {
+ context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+ $(event.currentTarget).data(DATA_KEY, context);
+ }
+
+ if (event) {
+ context._activeTrigger[event.type == 'focusin' ? 'focus' : 'hover'] = true;
+ }
+
+ if ($(context.getTipElement()).hasClass('in') || context._hoverState === 'in') {
+ context._hoverState = 'in';
+ return;
+ }
+
+ clearTimeout(context._timeout);
+
+ context._hoverState = HoverState.IN;
+
+ if (!context.config.delay || !context.config.delay.show) {
+ context.show();
+ return;
+ }
+
+ context._timeout = setTimeout(function () {
+ if (context._hoverState === HoverState.IN) {
+ context.show();
+ }
+ }, context.config.delay.show);
+ }
+ }, {
+ key: '_leave',
+ value: function _leave(event, context) {
+ context = context || $(event.currentTarget).data(DATA_KEY);
+
+ if (!context) {
+ context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+ $(event.currentTarget).data(DATA_KEY, context);
+ }
+
+ if (event) {
+ context._activeTrigger[event.type == 'focusout' ? 'focus' : 'hover'] = false;
+ }
+
+ if (context._isWithActiveTrigger()) {
+ return;
+ }
+
+ clearTimeout(context._timeout);
+
+ context._hoverState = HoverState.OUT;
+
+ if (!context.config.delay || !context.config.delay.hide) {
+ context.hide();
+ return;
+ }
+
+ context._timeout = setTimeout(function () {
+ if (context._hoverState === HoverState.OUT) {
+ context.hide();
+ }
+ }, context.config.delay.hide);
+ }
+ }, {
+ key: '_isWithActiveTrigger',
+ value: function _isWithActiveTrigger() {
+ for (var trigger in this._activeTrigger) {
+ if (this._activeTrigger[trigger]) {
+ return true;
+ }
+ }
+
+ return false;
+ }
+ }, {
+ key: '_getConfig',
+ value: function _getConfig(config) {
+ config = $.extend({}, Default, $(this.element).data(), config);
+
+ if (config.delay && typeof config.delay === 'number') {
+ config.delay = {
+ 'show': config.delay,
+ 'hide': config.delay
+ };
+ }
+
+ return config;
+ }
+ }, {
+ key: '_getDelegateConfig',
+ value: function _getDelegateConfig() {
+ var config = {};
+
+ if (this.config) {
+ for (var key in this.config) {
+ var value = this.config[key];
+ if (Default[key] !== value) {
+ config[key] = value;
+ }
+ }
+ }
+
+ return config;
+ }
+ }], [{
+ key: 'VERSION',
+
+ // getters
+
+ get: function () {
+ return VERSION;
+ }
+ }, {
+ key: 'Default',
+ get: function () {
+ return Default;
+ }
+ }, {
+ key: '_jQueryInterface',
+
+ // static
+
+ value: function _jQueryInterface(config) {
+ return this.each(function () {
+ var data = $(this).data(DATA_KEY);
+ var _config = typeof config === 'object' ? config : null;
+
+ if (!data && /destroy|hide/.test(config)) {
+ return;
+ }
+
+ if (!data) {
+ data = new Tooltip(this, _config);
+ $(this).data(DATA_KEY, data);
+ }
+
+ if (typeof config === 'string') {
+ data[config]();
+ }
+ });
+ }
+ }]);
+
+ return Tooltip;
+ })();
+
+ /**
+ * ------------------------------------------------------------------------
+ * jQuery
+ * ------------------------------------------------------------------------
+ */
+
+ $.fn[NAME] = Tooltip._jQueryInterface;
+ $.fn[NAME].Constructor = Tooltip;
+ $.fn[NAME].noConflict = function () {
+ $.fn[NAME] = JQUERY_NO_CONFLICT;
+ return Tooltip._jQueryInterface;
+ };
+
+ return Tooltip;
+})(jQuery);
+//# sourceMappingURL=tooltip.js.map \ No newline at end of file