Skip to content
GitLab
Switch branch/tag
Find file BlameHistoryPermalink
button.js 4.28 KiB
1 
import $ from 'jquery'
2
3 
/**
4 
 * --------------------------------------------------------------------------
5 
 * Bootstrap (v4.1.3): button.js
6 
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
7 
 * --------------------------------------------------------------------------
8 
 */
9
10 
/**
11 
 * ------------------------------------------------------------------------
12 
 * Constants
13 
 * ------------------------------------------------------------------------
14 
 */
15
16 
const NAME                = 'button'
17 
const VERSION             = '4.1.3'
18 
const DATA_KEY            = 'bs.button'
19 
const EVENT_KEY           = `.${DATA_KEY}`
20 
const DATA_API_KEY        = '.data-api'
21 
const JQUERY_NO_CONFLICT  = $.fn[NAME]
22
23 
const ClassName = {
24 
  ACTIVE : 'active',
25 
  BUTTON : 'btn',
26 
  FOCUS  : 'focus'
27 
}
28
29 
const Selector = {
30 
  DATA_TOGGLE_CARROT : '[data-toggle^="button"]',
31 
  DATA_TOGGLE        : '[data-toggle="buttons"]',
32 
  INPUT              : 'input',
33 
  ACTIVE             : '.active',
34 
  BUTTON             : '.btn'
35 
}
36
37 
const Event = {
38 
  CLICK_DATA_API      : `click${EVENT_KEY}${DATA_API_KEY}`,
39 
  FOCUS_BLUR_DATA_API : `focus${EVENT_KEY}${DATA_API_KEY} ` +
40 
                          `blur${EVENT_KEY}${DATA_API_KEY}`
41 
}
42
43 
/**
44 
 * ------------------------------------------------------------------------
45 
 * Class Definition
46 
 * ------------------------------------------------------------------------
47 
 */
48
49 
class Button {
50 
  constructor(element) {
51 
    this._element = element
52 
  }
53
54 
  // Getters
55
56 
  static get VERSION() {
57 
    return VERSION
58 
  }
59
60 
  // Public
61
62 
  toggle() {
63 
    let triggerChangeEvent = true
64 
    let addAriaPressed = true
65 
    const rootElement = $(this._element).closest(
66 
      Selector.DATA_TOGGLE
67 
    )[0]
68
69 
    if (rootElement) {
70 
      const input = this._element.querySelector(Selector.INPUT)
7172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
if (input) { if (input.type === 'radio') { if (input.checked && this._element.classList.contains(ClassName.ACTIVE)) { triggerChangeEvent = false } else { const activeElement = rootElement.querySelector(Selector.ACTIVE) if (activeElement) { $(activeElement).removeClass(ClassName.ACTIVE) } } } if (triggerChangeEvent) { if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) { return } input.checked = !this._element.classList.contains(ClassName.ACTIVE) $(input).trigger('change') } input.focus() addAriaPressed = false } } if (addAriaPressed) { this._element.setAttribute('aria-pressed', !this._element.classList.contains(ClassName.ACTIVE)) } if (triggerChangeEvent) { $(this._element).toggleClass(ClassName.ACTIVE) } } dispose() { $.removeData(this._element, DATA_KEY) this._element = null } // Static static _jQueryInterface(config) { return this.each(function () { let data = $(this).data(DATA_KEY) if (!data) { data = new Button(this) $(this).data(DATA_KEY, data) } if (config === 'toggle') { data[config]() } }) } } /** * ------------------------------------------------------------------------ * Data Api implementation * ------------------------------------------------------------------------ */
141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
$(document) .on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE_CARROT, (event) => { event.preventDefault() let button = event.target if (!$(button).hasClass(ClassName.BUTTON)) { button = $(button).closest(Selector.BUTTON) } Button._jQueryInterface.call($(button), 'toggle') }) .on(Event.FOCUS_BLUR_DATA_API, Selector.DATA_TOGGLE_CARROT, (event) => { const button = $(event.target).closest(Selector.BUTTON)[0] $(button).toggleClass(ClassName.FOCUS, /^focus(in)?$/.test(event.type)) }) /** * ------------------------------------------------------------------------ * jQuery * ------------------------------------------------------------------------ */ $.fn[NAME] = Button._jQueryInterface $.fn[NAME].Constructor = Button $.fn[NAME].noConflict = () => { $.fn[NAME] = JQUERY_NO_CONFLICT return Button._jQueryInterface } export default Button