Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
262 changes: 129 additions & 133 deletions js/src/alert.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,176 +8,172 @@ import Util from './util'
* --------------------------------------------------------------------------
*/

const Alert = (($) => {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/

const NAME = 'alert'
const VERSION = '4.1.3'
const DATA_KEY = 'bs.alert'
const EVENT_KEY = `.${DATA_KEY}`
const DATA_API_KEY = '.data-api'
const JQUERY_NO_CONFLICT = $.fn[NAME]

const Selector = {
DISMISS : '[data-dismiss="alert"]'
}
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/

const NAME = 'alert'
const VERSION = '4.1.3'
const DATA_KEY = 'bs.alert'
const EVENT_KEY = `.${DATA_KEY}`
const DATA_API_KEY = '.data-api'
const JQUERY_NO_CONFLICT = $.fn[NAME]

const Selector = {
DISMISS : '[data-dismiss="alert"]'
}

const Event = {
CLOSE : `close${EVENT_KEY}`,
CLOSED : `closed${EVENT_KEY}`,
CLICK_DATA_API : `click${EVENT_KEY}${DATA_API_KEY}`
}

const ClassName = {
ALERT : 'alert',
FADE : 'fade',
SHOW : 'show'
}

/**
* ------------------------------------------------------------------------
* Class Definition
* ------------------------------------------------------------------------
*/

const Event = {
CLOSE : `close${EVENT_KEY}`,
CLOSED : `closed${EVENT_KEY}`,
CLICK_DATA_API : `click${EVENT_KEY}${DATA_API_KEY}`
class Alert {
constructor(element) {
this._element = element
}

const ClassName = {
ALERT : 'alert',
FADE : 'fade',
SHOW : 'show'
// Getters

static get VERSION() {
return VERSION
}

/**
* ------------------------------------------------------------------------
* Class Definition
* ------------------------------------------------------------------------
*/
// Public

class Alert {
constructor(element) {
this._element = element
close(element) {
let rootElement = this._element
if (element) {
rootElement = this._getRootElement(element)
}

// Getters
const customEvent = this._triggerCloseEvent(rootElement)

static get VERSION() {
return VERSION
if (customEvent.isDefaultPrevented()) {
return
}

// Public
this._removeElement(rootElement)
}

close(element) {
let rootElement = this._element
if (element) {
rootElement = this._getRootElement(element)
}
dispose() {
$.removeData(this._element, DATA_KEY)
this._element = null
}

const customEvent = this._triggerCloseEvent(rootElement)
// Private

if (customEvent.isDefaultPrevented()) {
return
}
_getRootElement(element) {
const selector = Util.getSelectorFromElement(element)
let parent = false

this._removeElement(rootElement)
if (selector) {
parent = document.querySelector(selector)
}

dispose() {
$.removeData(this._element, DATA_KEY)
this._element = null
if (!parent) {
parent = $(element).closest(`.${ClassName.ALERT}`)[0]
}

// Private

_getRootElement(element) {
const selector = Util.getSelectorFromElement(element)
let parent = false

if (selector) {
parent = document.querySelector(selector)
}
return parent
}

if (!parent) {
parent = $(element).closest(`.${ClassName.ALERT}`)[0]
}
_triggerCloseEvent(element) {
const closeEvent = $.Event(Event.CLOSE)

return parent
}
$(element).trigger(closeEvent)
return closeEvent
}

_triggerCloseEvent(element) {
const closeEvent = $.Event(Event.CLOSE)
_removeElement(element) {
$(element).removeClass(ClassName.SHOW)

$(element).trigger(closeEvent)
return closeEvent
if (!$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element)
return
}

_removeElement(element) {
$(element).removeClass(ClassName.SHOW)
const transitionDuration = Util.getTransitionDurationFromElement(element)

if (!$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element)
return
}
$(element)
.one(Util.TRANSITION_END, (event) => this._destroyElement(element, event))
.emulateTransitionEnd(transitionDuration)
}

const transitionDuration = Util.getTransitionDurationFromElement(element)
_destroyElement(element) {
$(element)
.detach()
.trigger(Event.CLOSED)
.remove()
}

$(element)
.one(Util.TRANSITION_END, (event) => this._destroyElement(element, event))
.emulateTransitionEnd(transitionDuration)
}
// Static

_destroyElement(element) {
$(element)
.detach()
.trigger(Event.CLOSED)
.remove()
}
static _jQueryInterface(config) {
return this.each(function () {
const $element = $(this)
let data = $element.data(DATA_KEY)

// Static
if (!data) {
data = new Alert(this)
$element.data(DATA_KEY, data)
}

static _jQueryInterface(config) {
return this.each(function () {
const $element = $(this)
let data = $element.data(DATA_KEY)
if (config === 'close') {
data[config](this)
}
})
}

if (!data) {
data = new Alert(this)
$element.data(DATA_KEY, data)
}
static _handleDismiss(alertInstance) {
return function (event) {
if (event) {
event.preventDefault()
}

if (config === 'close') {
data[config](this)
}
})
alertInstance.close(this)
}
}
}

static _handleDismiss(alertInstance) {
return function (event) {
if (event) {
event.preventDefault()
}
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/

alertInstance.close(this)
}
}
}
$(document).on(
Event.CLICK_DATA_API,
Selector.DISMISS,
Alert._handleDismiss(new Alert())
)

/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/

$(document).on(
Event.CLICK_DATA_API,
Selector.DISMISS,
Alert._handleDismiss(new Alert())
)

/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/

$.fn[NAME] = Alert._jQueryInterface
$.fn[NAME].Constructor = Alert
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Alert._jQueryInterface
}
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/

return Alert
})($)
$.fn[NAME] = Alert._jQueryInterface
$.fn[NAME].Constructor = Alert
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Alert._jQueryInterface
}

export default Alert
Loading