c279b355f1687645116d42cdb70f4540b4ba9484.svn-base 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620
  1. (function (global, factory) {
  2. if (typeof define === 'function' && define.amd) {
  3. define(['exports', 'module', './util'], factory);
  4. } else if (typeof exports !== 'undefined' && typeof module !== 'undefined') {
  5. factory(exports, module, require('./util'));
  6. } else {
  7. var mod = {
  8. exports: {}
  9. };
  10. factory(mod.exports, mod, global.Util);
  11. global.tooltip = mod.exports;
  12. }
  13. })(this, function (exports, module, _util) {
  14. 'use strict';
  15. 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; }; })();
  16. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  17. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
  18. var _Util = _interopRequireDefault(_util);
  19. /**
  20. * --------------------------------------------------------------------------
  21. * Bootstrap (v4.0.0): tooltip.js
  22. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  23. * --------------------------------------------------------------------------
  24. */
  25. var Tooltip = (function ($) {
  26. /**
  27. * ------------------------------------------------------------------------
  28. * Constants
  29. * ------------------------------------------------------------------------
  30. */
  31. var NAME = 'tooltip';
  32. var VERSION = '4.0.0';
  33. var DATA_KEY = 'bs.tooltip';
  34. var EVENT_KEY = '.' + DATA_KEY;
  35. var JQUERY_NO_CONFLICT = $.fn[NAME];
  36. var TRANSITION_DURATION = 150;
  37. var CLASS_PREFIX = 'bs-tether';
  38. var Default = {
  39. animation: true,
  40. template: '<div class="tooltip" role="tooltip">' + '<div class="tooltip-arrow"></div>' + '<div class="tooltip-inner"></div></div>',
  41. trigger: 'hover focus',
  42. title: '',
  43. delay: 0,
  44. html: false,
  45. selector: false,
  46. placement: 'top',
  47. offset: '0 0',
  48. constraints: []
  49. };
  50. var DefaultType = {
  51. animation: 'boolean',
  52. template: 'string',
  53. title: '(string|function)',
  54. trigger: 'string',
  55. delay: '(number|object)',
  56. html: 'boolean',
  57. selector: '(string|boolean)',
  58. placement: '(string|function)',
  59. offset: 'string',
  60. constraints: 'array'
  61. };
  62. var AttachmentMap = {
  63. TOP: 'bottom center',
  64. RIGHT: 'middle left',
  65. BOTTOM: 'top center',
  66. LEFT: 'middle right'
  67. };
  68. var HoverState = {
  69. IN: 'in',
  70. OUT: 'out'
  71. };
  72. var Event = {
  73. HIDE: 'hide' + EVENT_KEY,
  74. HIDDEN: 'hidden' + EVENT_KEY,
  75. SHOW: 'show' + EVENT_KEY,
  76. SHOWN: 'shown' + EVENT_KEY,
  77. INSERTED: 'inserted' + EVENT_KEY,
  78. CLICK: 'click' + EVENT_KEY,
  79. FOCUSIN: 'focusin' + EVENT_KEY,
  80. FOCUSOUT: 'focusout' + EVENT_KEY,
  81. MOUSEENTER: 'mouseenter' + EVENT_KEY,
  82. MOUSELEAVE: 'mouseleave' + EVENT_KEY
  83. };
  84. var ClassName = {
  85. FADE: 'fade',
  86. IN: 'in'
  87. };
  88. var Selector = {
  89. TOOLTIP: '.tooltip',
  90. TOOLTIP_INNER: '.tooltip-inner'
  91. };
  92. var TetherClass = {
  93. element: false,
  94. enabled: false
  95. };
  96. var Trigger = {
  97. HOVER: 'hover',
  98. FOCUS: 'focus',
  99. CLICK: 'click',
  100. MANUAL: 'manual'
  101. };
  102. /**
  103. * ------------------------------------------------------------------------
  104. * Class Definition
  105. * ------------------------------------------------------------------------
  106. */
  107. var Tooltip = (function () {
  108. function Tooltip(element, config) {
  109. _classCallCheck(this, Tooltip);
  110. // private
  111. this._isEnabled = true;
  112. this._timeout = 0;
  113. this._hoverState = '';
  114. this._activeTrigger = {};
  115. this._tether = null;
  116. // protected
  117. this.element = element;
  118. this.config = this._getConfig(config);
  119. this.tip = null;
  120. this._setListeners();
  121. }
  122. /**
  123. * ------------------------------------------------------------------------
  124. * jQuery
  125. * ------------------------------------------------------------------------
  126. */
  127. // getters
  128. _createClass(Tooltip, [{
  129. key: 'enable',
  130. // public
  131. value: function enable() {
  132. this._isEnabled = true;
  133. }
  134. }, {
  135. key: 'disable',
  136. value: function disable() {
  137. this._isEnabled = false;
  138. }
  139. }, {
  140. key: 'toggleEnabled',
  141. value: function toggleEnabled() {
  142. this._isEnabled = !this._isEnabled;
  143. }
  144. }, {
  145. key: 'toggle',
  146. value: function toggle(event) {
  147. if (event) {
  148. var dataKey = this.constructor.DATA_KEY;
  149. var context = $(event.currentTarget).data(dataKey);
  150. if (!context) {
  151. context = new this.constructor(event.currentTarget, this._getDelegateConfig());
  152. $(event.currentTarget).data(dataKey, context);
  153. }
  154. context._activeTrigger.click = !context._activeTrigger.click;
  155. if (context._isWithActiveTrigger()) {
  156. context._enter(null, context);
  157. } else {
  158. context._leave(null, context);
  159. }
  160. } else {
  161. if ($(this.getTipElement()).hasClass(ClassName.IN)) {
  162. this._leave(null, this);
  163. return;
  164. }
  165. this._enter(null, this);
  166. }
  167. }
  168. }, {
  169. key: 'dispose',
  170. value: function dispose() {
  171. clearTimeout(this._timeout);
  172. this.cleanupTether();
  173. $.removeData(this.element, this.constructor.DATA_KEY);
  174. $(this.element).off(this.constructor.EVENT_KEY);
  175. if (this.tip) {
  176. $(this.tip).remove();
  177. }
  178. this._isEnabled = null;
  179. this._timeout = null;
  180. this._hoverState = null;
  181. this._activeTrigger = null;
  182. this._tether = null;
  183. this.element = null;
  184. this.config = null;
  185. this.tip = null;
  186. }
  187. }, {
  188. key: 'show',
  189. value: function show() {
  190. var _this = this;
  191. var showEvent = $.Event(this.constructor.Event.SHOW);
  192. if (this.isWithContent() && this._isEnabled) {
  193. $(this.element).trigger(showEvent);
  194. var isInTheDom = $.contains(this.element.ownerDocument.documentElement, this.element);
  195. if (showEvent.isDefaultPrevented() || !isInTheDom) {
  196. return;
  197. }
  198. var tip = this.getTipElement();
  199. var tipId = _Util['default'].getUID(this.constructor.NAME);
  200. tip.setAttribute('id', tipId);
  201. this.element.setAttribute('aria-describedby', tipId);
  202. this.setContent();
  203. if (this.config.animation) {
  204. $(tip).addClass(ClassName.FADE);
  205. }
  206. var placement = typeof this.config.placement === 'function' ? this.config.placement.call(this, tip, this.element) : this.config.placement;
  207. var attachment = this._getAttachment(placement);
  208. $(tip).data(this.constructor.DATA_KEY, this).appendTo(document.body);
  209. $(this.element).trigger(this.constructor.Event.INSERTED);
  210. this._tether = new Tether({
  211. attachment: attachment,
  212. element: tip,
  213. target: this.element,
  214. classes: TetherClass,
  215. classPrefix: CLASS_PREFIX,
  216. offset: this.config.offset,
  217. constraints: this.config.constraints
  218. });
  219. _Util['default'].reflow(tip);
  220. this._tether.position();
  221. $(tip).addClass(ClassName.IN);
  222. var complete = function complete() {
  223. var prevHoverState = _this._hoverState;
  224. _this._hoverState = null;
  225. $(_this.element).trigger(_this.constructor.Event.SHOWN);
  226. if (prevHoverState === HoverState.OUT) {
  227. _this._leave(null, _this);
  228. }
  229. };
  230. if (_Util['default'].supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE)) {
  231. $(this.tip).one(_Util['default'].TRANSITION_END, complete).emulateTransitionEnd(Tooltip._TRANSITION_DURATION);
  232. return;
  233. }
  234. complete();
  235. }
  236. }
  237. }, {
  238. key: 'hide',
  239. value: function hide(callback) {
  240. var _this2 = this;
  241. var tip = this.getTipElement();
  242. var hideEvent = $.Event(this.constructor.Event.HIDE);
  243. var complete = function complete() {
  244. if (_this2._hoverState !== HoverState.IN && tip.parentNode) {
  245. tip.parentNode.removeChild(tip);
  246. }
  247. _this2.element.removeAttribute('aria-describedby');
  248. $(_this2.element).trigger(_this2.constructor.Event.HIDDEN);
  249. _this2.cleanupTether();
  250. if (callback) {
  251. callback();
  252. }
  253. };
  254. $(this.element).trigger(hideEvent);
  255. if (hideEvent.isDefaultPrevented()) {
  256. return;
  257. }
  258. $(tip).removeClass(ClassName.IN);
  259. if (_Util['default'].supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE)) {
  260. $(tip).one(_Util['default'].TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
  261. } else {
  262. complete();
  263. }
  264. this._hoverState = '';
  265. }
  266. // protected
  267. }, {
  268. key: 'isWithContent',
  269. value: function isWithContent() {
  270. return Boolean(this.getTitle());
  271. }
  272. }, {
  273. key: 'getTipElement',
  274. value: function getTipElement() {
  275. return this.tip = this.tip || $(this.config.template)[0];
  276. }
  277. }, {
  278. key: 'setContent',
  279. value: function setContent() {
  280. var tip = this.getTipElement();
  281. var title = this.getTitle();
  282. var method = this.config.html ? 'innerHTML' : 'innerText';
  283. $(tip).find(Selector.TOOLTIP_INNER)[0][method] = title;
  284. $(tip).removeClass(ClassName.FADE).removeClass(ClassName.IN);
  285. this.cleanupTether();
  286. }
  287. }, {
  288. key: 'getTitle',
  289. value: function getTitle() {
  290. var title = this.element.getAttribute('data-original-title');
  291. if (!title) {
  292. title = typeof this.config.title === 'function' ? this.config.title.call(this.element) : this.config.title;
  293. }
  294. return title;
  295. }
  296. }, {
  297. key: 'cleanupTether',
  298. value: function cleanupTether() {
  299. if (this._tether) {
  300. this._tether.destroy();
  301. // clean up after tether's junk classes
  302. // remove after they fix issue
  303. // (https://github.com/HubSpot/tether/issues/36)
  304. $(this.element).removeClass(this._removeTetherClasses);
  305. $(this.tip).removeClass(this._removeTetherClasses);
  306. }
  307. }
  308. // private
  309. }, {
  310. key: '_getAttachment',
  311. value: function _getAttachment(placement) {
  312. return AttachmentMap[placement.toUpperCase()];
  313. }
  314. }, {
  315. key: '_setListeners',
  316. value: function _setListeners() {
  317. var _this3 = this;
  318. var triggers = this.config.trigger.split(' ');
  319. triggers.forEach(function (trigger) {
  320. if (trigger === 'click') {
  321. $(_this3.element).on(_this3.constructor.Event.CLICK, _this3.config.selector, $.proxy(_this3.toggle, _this3));
  322. } else if (trigger !== Trigger.MANUAL) {
  323. var eventIn = trigger === Trigger.HOVER ? _this3.constructor.Event.MOUSEENTER : _this3.constructor.Event.FOCUSIN;
  324. var eventOut = trigger === Trigger.HOVER ? _this3.constructor.Event.MOUSELEAVE : _this3.constructor.Event.FOCUSOUT;
  325. $(_this3.element).on(eventIn, _this3.config.selector, $.proxy(_this3._enter, _this3)).on(eventOut, _this3.config.selector, $.proxy(_this3._leave, _this3));
  326. }
  327. });
  328. if (this.config.selector) {
  329. this.config = $.extend({}, this.config, {
  330. trigger: 'manual',
  331. selector: ''
  332. });
  333. } else {
  334. this._fixTitle();
  335. }
  336. }
  337. }, {
  338. key: '_removeTetherClasses',
  339. value: function _removeTetherClasses(i, css) {
  340. return ((css.baseVal || css).match(new RegExp('(^|\\s)' + CLASS_PREFIX + '-\\S+', 'g')) || []).join(' ');
  341. }
  342. }, {
  343. key: '_fixTitle',
  344. value: function _fixTitle() {
  345. var titleType = typeof this.element.getAttribute('data-original-title');
  346. if (this.element.getAttribute('title') || titleType !== 'string') {
  347. this.element.setAttribute('data-original-title', this.element.getAttribute('title') || '');
  348. this.element.setAttribute('title', '');
  349. }
  350. }
  351. }, {
  352. key: '_enter',
  353. value: function _enter(event, context) {
  354. var dataKey = this.constructor.DATA_KEY;
  355. context = context || $(event.currentTarget).data(dataKey);
  356. if (!context) {
  357. context = new this.constructor(event.currentTarget, this._getDelegateConfig());
  358. $(event.currentTarget).data(dataKey, context);
  359. }
  360. if (event) {
  361. context._activeTrigger[event.type === 'focusin' ? Trigger.FOCUS : Trigger.HOVER] = true;
  362. }
  363. if ($(context.getTipElement()).hasClass(ClassName.IN) || context._hoverState === HoverState.IN) {
  364. context._hoverState = HoverState.IN;
  365. return;
  366. }
  367. clearTimeout(context._timeout);
  368. context._hoverState = HoverState.IN;
  369. if (!context.config.delay || !context.config.delay.show) {
  370. context.show();
  371. return;
  372. }
  373. context._timeout = setTimeout(function () {
  374. if (context._hoverState === HoverState.IN) {
  375. context.show();
  376. }
  377. }, context.config.delay.show);
  378. }
  379. }, {
  380. key: '_leave',
  381. value: function _leave(event, context) {
  382. var dataKey = this.constructor.DATA_KEY;
  383. context = context || $(event.currentTarget).data(dataKey);
  384. if (!context) {
  385. context = new this.constructor(event.currentTarget, this._getDelegateConfig());
  386. $(event.currentTarget).data(dataKey, context);
  387. }
  388. if (event) {
  389. context._activeTrigger[event.type === 'focusout' ? Trigger.FOCUS : Trigger.HOVER] = false;
  390. }
  391. if (context._isWithActiveTrigger()) {
  392. return;
  393. }
  394. clearTimeout(context._timeout);
  395. context._hoverState = HoverState.OUT;
  396. if (!context.config.delay || !context.config.delay.hide) {
  397. context.hide();
  398. return;
  399. }
  400. context._timeout = setTimeout(function () {
  401. if (context._hoverState === HoverState.OUT) {
  402. context.hide();
  403. }
  404. }, context.config.delay.hide);
  405. }
  406. }, {
  407. key: '_isWithActiveTrigger',
  408. value: function _isWithActiveTrigger() {
  409. for (var trigger in this._activeTrigger) {
  410. if (this._activeTrigger[trigger]) {
  411. return true;
  412. }
  413. }
  414. return false;
  415. }
  416. }, {
  417. key: '_getConfig',
  418. value: function _getConfig(config) {
  419. config = $.extend({}, this.constructor.Default, $(this.element).data(), config);
  420. if (config.delay && typeof config.delay === 'number') {
  421. config.delay = {
  422. show: config.delay,
  423. hide: config.delay
  424. };
  425. }
  426. _Util['default'].typeCheckConfig(NAME, config, this.constructor.DefaultType);
  427. return config;
  428. }
  429. }, {
  430. key: '_getDelegateConfig',
  431. value: function _getDelegateConfig() {
  432. var config = {};
  433. if (this.config) {
  434. for (var key in this.config) {
  435. if (this.constructor.Default[key] !== this.config[key]) {
  436. config[key] = this.config[key];
  437. }
  438. }
  439. }
  440. return config;
  441. }
  442. // static
  443. }], [{
  444. key: '_jQueryInterface',
  445. value: function _jQueryInterface(config) {
  446. return this.each(function () {
  447. var data = $(this).data(DATA_KEY);
  448. var _config = typeof config === 'object' ? config : null;
  449. if (!data && /destroy|hide/.test(config)) {
  450. return;
  451. }
  452. if (!data) {
  453. data = new Tooltip(this, _config);
  454. $(this).data(DATA_KEY, data);
  455. }
  456. if (typeof config === 'string') {
  457. data[config]();
  458. }
  459. });
  460. }
  461. }, {
  462. key: 'VERSION',
  463. get: function get() {
  464. return VERSION;
  465. }
  466. }, {
  467. key: 'Default',
  468. get: function get() {
  469. return Default;
  470. }
  471. }, {
  472. key: 'NAME',
  473. get: function get() {
  474. return NAME;
  475. }
  476. }, {
  477. key: 'DATA_KEY',
  478. get: function get() {
  479. return DATA_KEY;
  480. }
  481. }, {
  482. key: 'Event',
  483. get: function get() {
  484. return Event;
  485. }
  486. }, {
  487. key: 'EVENT_KEY',
  488. get: function get() {
  489. return EVENT_KEY;
  490. }
  491. }, {
  492. key: 'DefaultType',
  493. get: function get() {
  494. return DefaultType;
  495. }
  496. }]);
  497. return Tooltip;
  498. })();
  499. $.fn[NAME] = Tooltip._jQueryInterface;
  500. $.fn[NAME].Constructor = Tooltip;
  501. $.fn[NAME].noConflict = function () {
  502. $.fn[NAME] = JQUERY_NO_CONFLICT;
  503. return Tooltip._jQueryInterface;
  504. };
  505. return Tooltip;
  506. })(jQuery);
  507. module.exports = Tooltip;
  508. });