1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-07 22:26:57 +02:00

button -> es6

This commit is contained in:
fat
2015-05-07 17:07:38 -07:00
parent c3a79b1a8c
commit 6605051882
14 changed files with 338 additions and 383 deletions

View File

@@ -8,7 +8,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Alert = (() => {
const Alert = (($) => {
/**
@@ -58,6 +58,8 @@ const Alert = (() => {
// public
close(element) {
element = element || this.element
let rootElement = this._getRootElement(element)
let customEvent = this._triggerCloseEvent(rootElement)
@@ -167,12 +169,12 @@ const Alert = (() => {
$.fn[NAME] = Alert._jQueryInterface
$.fn[NAME].Constructor = Alert
$.fn[NAME].noConflict = function () {
$.fn[NAME] = Alert._JQUERY_NO_CONFLICT
$.fn[NAME] = JQUERY_NO_CONFLICT
return Alert._jQueryInterface
}
return Alert
})()
})(jQuery)
export default Alert

158
js/src/button.js Normal file
View File

@@ -0,0 +1,158 @@
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.0.0): button.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
const Button = (($) => {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
const NAME = 'button'
const VERSION = '4.0.0'
const DATA_KEY = 'bs.button'
const JQUERY_NO_CONFLICT = $.fn[NAME]
const TRANSITION_DURATION = 150
const ClassName = {
ACTIVE : 'active',
BUTTON : 'btn',
FOCUS : 'focus'
}
const Selector = {
DATA_TOGGLE_CARROT : '[data-toggle^="button"]',
DATA_TOGGLE : '[data-toggle="buttons"]',
INPUT : 'input',
ACTIVE : '.active',
BUTTON : '.btn'
}
const Event = {
CLICK : 'click.bs.button.data-api',
FOCUS_BLUR : 'focus.bs.button.data-api blur.bs.button.data-api'
}
/**
* ------------------------------------------------------------------------
* Class Definition
* ------------------------------------------------------------------------
*/
class Button {
constructor(element) {
this.element = element
}
// public
toggle() {
let triggerChangeEvent = true
let rootElement = $(this.element).closest(
Selector.DATA_TOGGLE
)[0]
if (rootElement) {
let input = $(this.element).find(Selector.INPUT)[0]
if (input) {
if (input.type === 'radio') {
if (input.checked &&
$(this.element).hasClass(ClassName.ACTIVE)) {
triggerChangeEvent = false
} else {
let activeElement = $(rootElement).find(Selector.ACTIVE)[0]
if (activeElement) {
$(activeElement).removeClass(ClassName.ACTIVE)
}
}
}
if (triggerChangeEvent) {
input.checked = !$(this.element).hasClass(ClassName.ACTIVE)
$(this.element).trigger('change')
}
}
} else {
this.element.setAttribute('aria-pressed',
!$(this.element).hasClass(ClassName.ACTIVE))
}
if (triggerChangeEvent) {
$(this.element).toggleClass(ClassName.ACTIVE)
}
}
// 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
* ------------------------------------------------------------------------
*/
$(document)
.on(Event.CLICK, Selector.DATA_TOGGLE_CARROT, function (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, Selector.DATA_TOGGLE_CARROT, function (event) {
var 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 = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Button._jQueryInterface
}
return Button
})(jQuery)
export default Button

View File

@@ -5,7 +5,7 @@
* --------------------------------------------------------------------------
*/
const Util = (() => {
const Util = (($) => {
/**
@@ -119,6 +119,6 @@ const Util = (() => {
return Util
})()
})(jQuery)
export default Util