Skip to content
GitLab
Switch branch/tag
Find file BlameHistoryPermalink
toast.js 5.34 KiB
1 
/**
2 
 * --------------------------------------------------------------------------
3 
 * Bootstrap (v4.3.1): toast.js
4 
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
5 
 * --------------------------------------------------------------------------
6 
 */
7
8 
import {
9 
  jQuery as $,
10 
  TRANSITION_END,
11 
  emulateTransitionEnd,
12 
  getTransitionDurationFromElement,
13 
  typeCheckConfig
14 
} from './util/index'
15 
import Data from './dom/data'
16 
import EventHandler from './dom/eventHandler'
17 
import Manipulator from './dom/manipulator'
18
19 
/**
20 
 * ------------------------------------------------------------------------
21 
 * Constants
22 
 * ------------------------------------------------------------------------
23 
 */
24
25 
const NAME      = 'toast'
26 
const VERSION   = '4.3.1'
27 
const DATA_KEY  = 'bs.toast'
28 
const EVENT_KEY = `.${DATA_KEY}`
29
30 
const Event = {
31 
  CLICK_DISMISS : `click.dismiss${EVENT_KEY}`,
32 
  HIDE          : `hide${EVENT_KEY}`,
33 
  HIDDEN        : `hidden${EVENT_KEY}`,
34 
  SHOW          : `show${EVENT_KEY}`,
35 
  SHOWN         : `shown${EVENT_KEY}`
36 
}
37
38 
const ClassName = {
39 
  FADE    : 'fade',
40 
  HIDE    : 'hide',
41 
  SHOW    : 'show',
42 
  SHOWING : 'showing'
43 
}
44
45 
const DefaultType = {
46 
  animation : 'boolean',
47 
  autohide  : 'boolean',
48 
  delay     : 'number'
49 
}
50
51 
const Default = {
52 
  animation : true,
53 
  autohide  : true,
54 
  delay     : 500
55 
}
56
57 
const Selector = {
58 
  DATA_DISMISS : '[data-dismiss="toast"]'
59 
}
60
61 
/**
62 
 * ------------------------------------------------------------------------
63 
 * Class Definition
64 
 * ------------------------------------------------------------------------
65 
 */
66
67 
class Toast {
68 
  constructor(element, config) {
69 
    this._element = element
70 
    this._config  = this._getConfig(config)
7172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
this._timeout = null this._setListeners() Data.setData(element, DATA_KEY, this) } // Getters static get VERSION() { return VERSION } static get DefaultType() { return DefaultType } static get Default() { return Default } // Public show() { EventHandler.trigger(this._element, Event.SHOW) if (this._config.animation) { this._element.classList.add(ClassName.FADE) } const complete = () => { this._element.classList.remove(ClassName.SHOWING) this._element.classList.add(ClassName.SHOW) EventHandler.trigger(this._element, Event.SHOWN) if (this._config.autohide) { this.hide() } } this._element.classList.remove(ClassName.HIDE) this._element.classList.add(ClassName.SHOWING) if (this._config.animation) { const transitionDuration = getTransitionDurationFromElement(this._element) EventHandler.one(this._element, TRANSITION_END, complete) emulateTransitionEnd(this._element, transitionDuration) } else { complete() } } hide(withoutTimeout) { if (!this._element.classList.contains(ClassName.SHOW)) { return } EventHandler.trigger(this._element, Event.HIDE) if (withoutTimeout) { this._close() } else { this._timeout = setTimeout(() => { this._close() }, this._config.delay) } } dispose() { clearTimeout(this._timeout) this._timeout = null
141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
if (this._element.classList.contains(ClassName.SHOW)) { this._element.classList.remove(ClassName.SHOW) } EventHandler.off(this._element, Event.CLICK_DISMISS) Data.removeData(this._element, DATA_KEY) this._element = null this._config = null } // Private _getConfig(config) { config = { ...Default, ...Manipulator.getDataAttributes(this._element), ...typeof config === 'object' && config ? config : {} } typeCheckConfig( NAME, config, this.constructor.DefaultType ) return config } _setListeners() { EventHandler.on( this._element, Event.CLICK_DISMISS, Selector.DATA_DISMISS, () => this.hide(true) ) } _close() { const complete = () => { this._element.classList.add(ClassName.HIDE) EventHandler.trigger(this._element, Event.HIDDEN) } this._element.classList.remove(ClassName.SHOW) if (this._config.animation) { const transitionDuration = getTransitionDurationFromElement(this._element) EventHandler.one(this._element, TRANSITION_END, complete) emulateTransitionEnd(this._element, transitionDuration) } else { complete() } } // Static static _jQueryInterface(config) { return this.each(function () { let data = Data.getData(this, DATA_KEY) const _config = typeof config === 'object' && config if (!data) { data = new Toast(this, _config) } if (typeof config === 'string') { if (typeof data[config] === 'undefined') { throw new TypeError(`No method named "${config}"`)
211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241
} data[config](this) } }) } static _getInstance(element) { return Data.getData(element, DATA_KEY) } } /** * ------------------------------------------------------------------------ * jQuery * ------------------------------------------------------------------------ * add .toast to jQuery only if jQuery is present */ if (typeof $ !== 'undefined') { const JQUERY_NO_CONFLICT = $.fn[NAME] $.fn[NAME] = Toast._jQueryInterface $.fn[NAME].Constructor = Toast $.fn[NAME].noConflict = () => { $.fn[NAME] = JQUERY_NO_CONFLICT return Toast._jQueryInterface } } export default Toast