0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-10 22:24:19 +01:00
Bootstrap/js/src/alert.js

194 lines
4.1 KiB
JavaScript
Raw Normal View History

import Util from './util'
2015-05-07 21:48:22 +02:00
/**
* --------------------------------------------------------------------------
2016-10-19 17:27:41 +02:00
* Bootstrap (v4.0.0-alpha.5): alert.js
2015-05-07 21:48:22 +02:00
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
2015-05-08 02:07:38 +02:00
const Alert = (($) => {
2015-05-07 21:48:22 +02:00
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
2015-05-07 21:48:22 +02:00
const NAME = 'alert'
2016-10-19 17:27:41 +02:00
const VERSION = '4.0.0-alpha.5'
const DATA_KEY = 'bs.alert'
2015-05-13 21:48:34 +02:00
const EVENT_KEY = `.${DATA_KEY}`
const DATA_API_KEY = '.data-api'
const JQUERY_NO_CONFLICT = $.fn[NAME]
const TRANSITION_DURATION = 150
2015-05-07 21:48:22 +02:00
const Selector = {
DISMISS : '[data-dismiss="alert"]'
}
2015-05-07 21:48:22 +02:00
const Event = {
2015-05-13 21:48:34 +02:00
CLOSE : `close${EVENT_KEY}`,
CLOSED : `closed${EVENT_KEY}`,
CLICK_DATA_API : `click${EVENT_KEY}${DATA_API_KEY}`
}
2015-05-07 21:48:22 +02:00
const ClassName = {
ALERT : 'alert',
FADE : 'fade',
ACTIVE : 'active'
}
2015-05-07 21:48:22 +02:00
/**
* ------------------------------------------------------------------------
* Class Definition
* ------------------------------------------------------------------------
*/
2015-05-07 21:48:22 +02:00
class Alert {
2015-05-07 21:48:22 +02:00
constructor(element) {
2015-05-08 07:26:40 +02:00
this._element = element
2015-05-07 21:48:22 +02:00
}
// getters
static get VERSION() {
return VERSION
}
// public
close(element) {
2015-05-08 07:26:40 +02:00
element = element || this._element
2015-05-08 02:07:38 +02:00
let rootElement = this._getRootElement(element)
let customEvent = this._triggerCloseEvent(rootElement)
2015-05-07 21:48:22 +02:00
if (customEvent.isDefaultPrevented()) {
return
}
2015-05-07 21:48:22 +02:00
this._removeElement(rootElement)
2015-05-07 21:48:22 +02:00
}
2015-05-13 21:48:34 +02:00
dispose() {
$.removeData(this._element, DATA_KEY)
this._element = null
}
2015-05-07 21:48:22 +02:00
// private
2015-05-07 21:48:22 +02:00
_getRootElement(element) {
let selector = Util.getSelectorFromElement(element)
2015-08-19 04:22:46 +02:00
let parent = false
2015-05-07 21:48:22 +02:00
if (selector) {
parent = $(selector)[0]
}
2015-05-07 21:48:22 +02:00
if (!parent) {
2015-05-10 08:00:59 +02:00
parent = $(element).closest(`.${ClassName.ALERT}`)[0]
}
return parent
2015-05-07 21:48:22 +02:00
}
_triggerCloseEvent(element) {
2015-08-19 04:22:46 +02:00
let closeEvent = $.Event(Event.CLOSE)
$(element).trigger(closeEvent)
return closeEvent
2015-05-07 21:48:22 +02:00
}
_removeElement(element) {
$(element).removeClass(ClassName.ACTIVE)
2015-05-07 21:48:22 +02:00
if (!Util.supportsTransitionEnd() ||
!$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element)
return
}
2015-05-07 21:48:22 +02:00
$(element)
.one(Util.TRANSITION_END, (event) => this._destroyElement(element, event))
.emulateTransitionEnd(TRANSITION_DURATION)
}
2015-05-07 21:48:22 +02:00
_destroyElement(element) {
$(element)
.detach()
.trigger(Event.CLOSED)
.remove()
2015-05-07 21:48:22 +02:00
}
// static
2015-05-07 21:48:22 +02:00
static _jQueryInterface(config) {
return this.each(function () {
let $element = $(this)
let data = $element.data(DATA_KEY)
2015-05-07 21:48:22 +02:00
if (!data) {
data = new Alert(this)
$element.data(DATA_KEY, data)
}
2015-05-07 21:48:22 +02:00
if (config === 'close') {
data[config](this)
}
})
}
2015-05-07 21:48:22 +02:00
static _handleDismiss(alertInstance) {
return function (event) {
if (event) {
event.preventDefault()
}
2015-05-07 21:48:22 +02:00
alertInstance.close(this)
2015-05-07 21:48:22 +02:00
}
}
2015-05-07 21:48:22 +02:00
}
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
2015-05-07 21:48:22 +02:00
$(document).on(
2015-05-13 21:48:34 +02:00
Event.CLICK_DATA_API,
Selector.DISMISS,
Alert._handleDismiss(new Alert())
)
2015-05-07 21:48:22 +02:00
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/
2015-05-07 21:48:22 +02:00
$.fn[NAME] = Alert._jQueryInterface
$.fn[NAME].Constructor = Alert
$.fn[NAME].noConflict = function () {
2015-05-08 02:07:38 +02:00
$.fn[NAME] = JQUERY_NO_CONFLICT
return Alert._jQueryInterface
}
2015-05-07 21:48:22 +02:00
return Alert
2015-05-07 21:48:22 +02:00
2015-05-08 02:07:38 +02:00
})(jQuery)
2015-05-07 21:48:22 +02:00
export default Alert