0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-20 17:54:23 +01:00

Remove jQuery from Util.js

s
This commit is contained in:
Johann-S 2017-08-19 17:24:45 +02:00 committed by XhmikosR
parent ececf644f4
commit fb465c4745
18 changed files with 75 additions and 14 deletions

View File

@ -112,7 +112,8 @@ class Alert {
$(element)
.one(Util.TRANSITION_END, (event) => this._destroyElement(element, event))
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(transitionDuration)
}
_destroyElement(element) {

View File

@ -488,7 +488,8 @@ class Carousel {
setTimeout(() => $(this._element).trigger(slidEvent), 0)
})
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(transitionDuration)
} else {
$(activeElement).removeClass(ClassName.ACTIVE)
$(nextElement).addClass(ClassName.ACTIVE)

View File

@ -195,8 +195,8 @@ class Collapse {
$(this._element)
.one(Util.TRANSITION_END, complete)
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(transitionDuration)
this._element.style[dimension] = `${this._element[scrollSize]}px`
}
@ -254,7 +254,8 @@ class Collapse {
$(this._element)
.one(Util.TRANSITION_END, complete)
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(transitionDuration)
}
setTransitioning(isTransitioning) {

38
js/src/dom/event.js Normal file
View File

@ -0,0 +1,38 @@
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.0.0-beta): dom/event.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
const Event = {
on(element, event, handler) {
if (typeof event !== 'string') {
return
}
element.addEventListener(event, handler, false)
},
one(element, event, handler) {
const complete = () => {
/* eslint func-style: off */
handler()
element.removeEventListener(event, complete, false)
}
Event.on(element, event, complete)
},
trigger(element, event) {
if (typeof event !== 'string') {
return
}
const eventToDispatch = new CustomEvent(event, {
bubbles: true,
cancelable: true
})
element.dispatchEvent(eventToDispatch)
}
}
export default Event

View File

@ -189,7 +189,8 @@ class Modal {
$(this._element)
.one(Util.TRANSITION_END, (event) => this._hideModal(event))
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(this._element, transitionDuration)
} else {
this._hideModal()
}
@ -280,7 +281,8 @@ class Modal {
$(this._dialog)
.one(Util.TRANSITION_END, transitionComplete)
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(transitionDuration)
} else {
transitionComplete()
}
@ -387,7 +389,8 @@ class Modal {
$(this._backdrop)
.one(Util.TRANSITION_END, callback)
.emulateTransitionEnd(backdropTransitionDuration)
Util.emulateTransitionEnd(backdropTransitionDuration)
} else if (!this._isShown && this._backdrop) {
$(this._backdrop).removeClass(ClassName.SHOW)
@ -403,7 +406,8 @@ class Modal {
$(this._backdrop)
.one(Util.TRANSITION_END, callbackRemove)
.emulateTransitionEnd(backdropTransitionDuration)
Util.emulateTransitionEnd(backdropTransitionDuration)
} else {
callbackRemove()
}

View File

@ -159,7 +159,7 @@ class Tab {
$(active)
.removeClass(ClassName.SHOW)
.one(Util.TRANSITION_END, complete)
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(active, transitionDuration)
} else {
complete()
}

View File

@ -344,7 +344,8 @@ class Tooltip {
$(this.tip)
.one(Util.TRANSITION_END, complete)
.emulateTransitionEnd(transitionDuration)
Util.emulateTransitionEnd(tip, transitionDuration)
} else {
complete()
}

View File

@ -5,7 +5,7 @@
* --------------------------------------------------------------------------
*/
import $ from 'jquery'
import Event from './dom/event'
/**
* ------------------------------------------------------------------------
@ -118,7 +118,7 @@ const Util = {
},
triggerTransitionEnd(element) {
$(element).trigger(TRANSITION_END)
Event.trigger(element, Util.TRANSITION_END)
},
// TODO: Remove in v5
@ -130,6 +130,12 @@ const Util = {
return (obj[0] || obj).nodeType
},
emulateTransitionEnd(element, duration) {
setTimeout(() => {
Util.triggerTransitionEnd(element)
}, duration)
},
typeCheckConfig(componentName, config, configTypes) {
for (const property in configTypes) {
if (Object.prototype.hasOwnProperty.call(configTypes, property)) {
@ -172,6 +178,4 @@ const Util = {
}
}
setTransitionEndSupport()
export default Util

View File

@ -97,6 +97,7 @@
</script>
<!-- Transpiled Plugins -->
<script src="../dist/dom/event.js"></script>
<script src="../dist/util.js"></script>
<script src="../dist/alert.js"></script>
<script src="../dist/button.js"></script>

View File

@ -52,6 +52,7 @@
</div>
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/alert.js"></script>
</body>

View File

@ -45,6 +45,7 @@
</div>
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/button.js"></script>
</body>

View File

@ -46,6 +46,7 @@
</div>
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/carousel.js"></script>
<script>

View File

@ -72,6 +72,7 @@
</div>
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/collapse.js"></script>
</body>

View File

@ -205,6 +205,7 @@
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../../node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/dropdown.js"></script>
<script src="../../dist/collapse.js"></script>

View File

@ -207,6 +207,7 @@
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../../node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/modal.js"></script>
<script src="../../dist/collapse.js"></script>

View File

@ -33,6 +33,7 @@
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../../node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/tooltip.js"></script>
<script src="../../dist/popover.js"></script>

View File

@ -87,6 +87,8 @@
</div>
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../../site/docs/4.2/assets/js/vendor/popper.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/scrollspy.js"></script>
<script src="../../dist/dropdown.js"></script>

View File

@ -227,6 +227,7 @@
<script src="../../../node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="../../../node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="../../dist/dom/event.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/tab.js"></script>
<script src="../../dist/dropdown.js"></script>